fix(Accordion): address QA updates from design (#1948)

- better positioning of `NumberIcon` when used with `Accordion` - fixes to color token when using `Icon` instances
chanzuckerberg · May 17, 2024 · 56fa437 · 56fa437
1 parent 007d757
commit 56fa437
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/src/components/Accordion/Accordion-v2.module.css b/src/components/Accordion/Accordion-v2.module.css
@@ -103,7 +103,12 @@
 }
 
 .accordion-button__leading-icon {
-  color: var(--eds-theme-color-icon-utility-default-primary);
+  color: var(--eds-theme-color-icon-utility-default-secondary);
+
+  /* Targeting NumberIcons and other images used in this specific context */
+  & [role='img'] {
+    display: inline-flex;
+  }
 }
 
 .accordion-button__title {

diff --git a/src/components/Accordion/Accordion-v2.tsx b/src/components/Accordion/Accordion-v2.tsx
@@ -109,7 +109,7 @@ type AccordionRowProps = {
    */
   isExpandable?: boolean;
   /**
-   *
+   * Whether the row has a leading icon on the row's trigger
    */
   hasLeadingIcon?: boolean;
 };
-Original file line number
+Diff line change
@@ Expand Up / @@ -109,7 +109,7 @@ type AccordionRowProps = { @@
        */
       isExpandable?: boolean;
       /**
-       *
+       * Whether the row has a leading icon on the row's trigger
        */
       hasLeadingIcon?: boolean;
     };
@@ Expand Down @@