fix(ui): invert color of header option menu button

a-asaad · a-asaad · commit d91234121af8 · 2025-01-23T08:56:07.000-07:00
Update to @carbon/react breaks the 'iconClass' attribute. Use a direct CSS selector instead.
diff --git a/ui/src/components/options-menu/OptionsMenu.tsx b/ui/src/components/options-menu/OptionsMenu.tsx
@@ -7,7 +7,6 @@ const OptionsMenu = () => {
   return (
     <OverflowMenu
       className="options-menu"
-      iconClass="options-menu-icon"
       aria-label="options-menu"
       iconDescription="options"
       align="bottom-end"
diff --git a/ui/src/styles.scss b/ui/src/styles.scss
@@ -43,7 +43,7 @@
     background-color: themes.$background-inverse-hover;
   }
 
-  .options-menu-icon {
+  .options-menu > svg {
     fill: themes.$icon-inverse;
   }
 }

Original file line number	Diff line number	Diff line change
`@@ -43,7 +43,7 @@`
`43`	`43`	`background-color: themes.$background-inverse-hover;`
`44`	`44`	`}`
`45`	`45`
`46`		`- .options-menu-icon {`
	`46`	`+ .options-menu > svg {`
`47`	`47`	`fill: themes.$icon-inverse;`
`48`	`48`	`}`
`49`	`49`	`}`