[Fleet][Eui Visual Refresh] Update text color tokens

elastic · Dec 17, 2024 · b5de8bc · b5de8bc
1 parent b3124d7
commit b5de8bc
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 7 deletions.
diff --git a/x-pack/plugins/fleet/public/applications/fleet/app.tsx b/x-pack/plugins/fleet/public/applications/fleet/app.tsx
@@ -247,7 +247,7 @@ const FleetTopNav = memo(
 
     const readOnlyBtnClass = React.useMemo(() => {
       return css`
-        color: ${euiTheme.colors.text};
+        color: ${euiTheme.colors.textParagraph};
       `;
     }, [euiTheme]);
 

diff --git a/x-pack/plugins/fleet/public/applications/integrations/components/header/header.tsx b/x-pack/plugins/fleet/public/applications/integrations/components/header/header.tsx
@@ -34,7 +34,7 @@ export const IntegrationsHeader = ({
   const { euiTheme } = useEuiTheme();
   const readOnlyBtnClass = React.useMemo(() => {
     return css`
-      color: ${euiTheme.colors.text};
+      color: ${euiTheme.colors.textParagraph};
     `;
   }, [euiTheme]);
   const isReadOnly = useIsReadOnly();

diff --git a/x-pack/plugins/fleet/public/components/danger_eui_context_menu_item.tsx b/x-pack/plugins/fleet/public/components/danger_eui_context_menu_item.tsx
@@ -5,9 +5,19 @@
  * 2.0.
  */
 
-import styled from 'styled-components';
-import { EuiContextMenuItem } from '@elastic/eui';
+import React from 'react';
+import { css } from '@emotion/react';
+import type { EuiContextMenuItemProps } from '@elastic/eui';
+import { EuiContextMenuItem, useEuiTheme } from '@elastic/eui';
 
-export const DangerEuiContextMenuItem = styled(EuiContextMenuItem)`
-  color: ${(props) => props.theme.eui.euiColorDangerText};
-`;
+export const DangerEuiContextMenuItem = (props: EuiContextMenuItemProps) => {
+  const theme = useEuiTheme();
+  return (
+    <EuiContextMenuItem
+      {...props}
+      css={css`
+        color: ${theme.euiTheme.colors.textDanger};
+      `}
+    />
+  );
+};