fix(accordion): update arrow spacing for start variant

[janhassel]

Currently, the chevrons in the "start"-variant of the Accordion (with the chevrons on the left) have 8px of left spacing whereas the chevrons in the "end"-variant (with the chevrons on the right) have a right spacing of 16px.

After checking with @aagonzales, the left spacing on the "start"-variant should also be 16px / spacing-05.

Before

After

Changelog

Changed

• Updated left spacing of chevron in "start"-variant to use $spacing-05/16px.
• Added a $spacing-05/16px spacing to the right of the accordion title based on spec from @aagonzales:
  • 

Testing / Reviewing

1. Run react storybook / open netlify preview
2. Ensure that the chevrons always have 16px to their left and right regardless of variant
3. Ensure the title has a right spacing of 16px in the "start"-variant

[netlify]

✔️ Deploy Preview for carbon-react-next ready!

🔨 Explore the source changes: 6ea0730

🔍 Inspect the deploy log: https://app.netlify.com/sites/carbon-react-next/deploys/615b311399c077000805d1c1

😎 Browse the preview: https://deploy-preview-9777--carbon-react-next.netlify.app

[netlify]

✔️ Deploy Preview for carbon-elements ready!

🔨 Explore the source changes: 6ea0730

🔍 Inspect the deploy log: https://app.netlify.com/sites/carbon-elements/deploys/615b3113e08f400008528b5a

😎 Browse the preview: https://deploy-preview-9777--carbon-elements.netlify.app

[netlify]

✔️ Deploy Preview for carbon-components-react ready!
Built without sensitive environment variables

🔨 Explore the source changes: 6ea0730

🔍 Inspect the deploy log: https://app.netlify.com/sites/carbon-components-react/deploys/615b3113b843c00007419056

😎 Browse the preview: https://deploy-preview-9777--carbon-components-react.netlify.app

[tay1orjones]

Looks good, thanks for adding it to the styles package as well!

[jnm2377]

Looks great! Thanks for the fix!

[jnm2377]

@aagonzales could you verify this is all up to spec? It's a visual bug fix for start chevron accordions.

https://deploy-preview-9777--carbon-components-react.netlify.app/?path=/story/components-accordion--playgroundhttps://deploy-preview-9777--carbon-components-react.netlify.app/?path=/story/components-accordion--playground

[aagonzales]

Yeah it looks correct, if the padding area includes the 16px icon then it would be 32px/spacing-07 there instead.