search

carbon-design-system / carbon

A design system built by IBM
https://www.carbondesignsystem.com
Apache License 2.0
7.86k stars 1.82k forks source link

Would like for the AccordionItem to span the entire width of the Accordion #7174

Closed MarcelPoirier closed 3 years ago

MarcelPoirier commented 4 years ago

Summary

Currently the Accordion component forces left and right padding (right is 25% of the width) on its content. While this makes sense if you have text in the accordion our UX thinks that if you have other components (e.g. Input control) that they should span the entire width of the accordion.

Clarify if you are asking for design, development, or both design and design & development.

Justification

In Cognos Analytics we sometimes use the Accordion to bucket properties. Our UX thinks that those properties should span the entire width of the accordion. For example image

Desired UX and success metrics

New property on the Accordion or AccordionItem to specify that you want the content to span the entire width. image

Specific timeline issues / requests

We will most likely override the Carbon CSS for our upcoming release, but would like this ASAP

vpicone commented 3 years ago

That padding is there for the base, common case (typography). If you're supplying components, they can go all the way to 16px padding. Use a padding that is appropriate for your content. This would be a case where you could feel free to override our style.

aagonzales commented 3 years ago

This is similar to what happens in Modal https://carbondesignsystem.com/components/modal/usage#alignment