Fix Accordion::Item::Button size after refactor

hashicorp · Jun 18, 2024 · 60821a2 · 60821a2
1 parent 0c68ef1
commit 60821a2
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 5 deletions.
diff --git a/packages/components/src/styles/components/accordion.scss b/packages/components/src/styles/components/accordion.scss
@@ -109,8 +109,6 @@ $hds-accordion-item-gap: 12px;
 }
 
 .hds-accordion-item__button {
-  width: var(--hds-accordion-item-icon);
-  height: var(--hds-accordion-item-icon);
   padding: 0;
 
   &:hover { cursor: pointer; }
@@ -161,6 +159,11 @@ $hds-accordion-item-gap: 12px;
   @include hds-button-color-secondary();
 }
 
+.hds-accordion-item__button {
+  width: var(--hds-accordion-item-icon);
+  height: var(--hds-accordion-item-icon);
+}
+
 // animate chevron icon
 .hds-accordion-item__button--is-open {
   .flight-icon-chevron-down {

diff --git a/showcase/app/templates/components/accordion.hbs b/showcase/app/templates/components/accordion.hbs
@@ -575,7 +575,7 @@
         >
           {{#each @model.STATES as |state|}}
             <SF.Item @label={{state}}>
-              <div class="shw-component-accordion-standalone-button">
+              <div class="shw-component-accordion-standalone-button hds-accordion-item--size-{{size}}">
                 <Hds::Accordion::Item::Button
                   @parentContainsInteractive={{bool}}
                   @onClickToggle={{this.noop}}
@@ -588,7 +588,7 @@
           {{/each}}
 
           <SF.Item @label="isOpen=true">
-            <div class="shw-component-accordion-standalone-button">
+            <div class="shw-component-accordion-standalone-button hds-accordion-item--size-{{size}}">
               <Hds::Accordion::Item::Button
                 @parentContainsInteractive={{bool}}
                 @isOpen={{true}}
@@ -600,7 +600,7 @@
           </SF.Item>
 
           <SF.Item @label="focus & isOpen=true" {{style width="calc(20% - 2rem)" position="relative"}}>
-            <div class="shw-component-accordion-standalone-button">
+            <div class="shw-component-accordion-standalone-button hds-accordion-item--size-{{size}}">
               <Hds::Accordion::Item::Button
                 @parentContainsInteractive={{bool}}
                 @isOpen={{true}}