- Extremely important to focus on one single thing at a time.
- To organize related information.
- Reduce scrolling when content is complete selected.
- When space must be optimized and there are long content. e.g. two pizza halves
Contains the section title and is control for revealing the panel.
- The title should be as brief as possible while still being clear and descriptive.
Indicates if the panel is open or closed.
Content inside of a section are composed for different associated sets of options.
The sections are opened and showing the content by default. The header is used to close or open the content by clicking it.
When the user scrolls down a long way, they can keep context of where they are by looking at the sticky header. They may also collapse a long section easily using the sticky header.
The collapsible section allows for a series of states: expand & collapsed.
Updated over 1 year ago