fix(accordion): top align accordion headings (#4125)

* fix(accordion): top align accordion headings * fix(theme-tokens): offset chevron positioning due to alignment change * docs(Accordion): adjust example according to design guidelines * chore: sync generated files
carbon-design-system · Sep 27, 2019 · 1974a1e · 1974a1e
1 parent 40da1fa
commit 1974a1e
Show file tree

Hide file tree

Showing 4 changed files with 5 additions and 5 deletions.
diff --git a/packages/components/docs/sass.md b/packages/components/docs/sass.md
@@ -9872,7 +9872,7 @@ Accordion styles
     @include button-reset;
     color: $text-01;
     display: flex;
-    align-items: center;
+    align-items: flex-start;
     justify-content: $accordion-justify-content;
     cursor: pointer;
     padding: rem(6px) 0;

diff --git a/packages/components/src/components/accordion/_accordion.scss b/packages/components/src/components/accordion/_accordion.scss
@@ -36,7 +36,7 @@
     @include button-reset;
     color: $text-01;
     display: flex;
-    align-items: center;
+    align-items: flex-start;
     justify-content: $accordion-justify-content;
     cursor: pointer;
     padding: rem(6px) 0;

diff --git a/packages/components/src/globals/scss/_theme-tokens.scss b/packages/components/src/globals/scss/_theme-tokens.scss
@@ -162,7 +162,7 @@ $accordion-justify-content: flex-start !default;
 /// @type Value
 /// @access public
 /// @group accordion
-$accordion-arrow-margin: 0 $carbon--spacing-05 0 0 !default;
+$accordion-arrow-margin: 2px $carbon--spacing-05 0 0 !default;
 
 /// @type Value
 /// @access public

diff --git a/packages/react/src/components/Accordion/Accordion-story.js b/packages/react/src/components/Accordion/Accordion-story.js
@@ -67,9 +67,9 @@ storiesOf('Accordion', module)
         </AccordionItem>
         <AccordionItem
           title={
-            <h4>
+            <span>
               Section 4 title (<em>the title can be a node</em>)
-            </h4>
+            </span>
           }
           {...props}>
           <p>