With accordion type only one item will expanded (active). When other item is selected, the currently active will collapse.
-
First ItemLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
Second Item
Ut eu dapibus velit. Duis commodo sollicitudin molestie. Fusce felis eros, tincidunt id venenatis et, molestie et sem.
-
Third Item
Vivamus id nunc auctor, faucibus purus sed, accumsan quam. Phasellus tincidunt ex tellus, vel maximus magna vestibulum vitae.
This type allows multiple items to be expanded. Toggling an item’s state only affects itself.
-
I am expandedLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
Also expanded
Ut eu dapibus velit. Duis commodo sollicitudin molestie. Fusce felis eros, tincidunt id venenatis et, molestie et sem.
Popout type works like an accordion but with different expanding style.
-
First ItemLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
Second Item
Ut eu dapibus velit. Duis commodo sollicitudin molestie. Fusce felis eros, tincidunt id venenatis et, molestie et sem.
-
Third Item
Vivamus id nunc auctor, faucibus purus sed, accumsan quam. Phasellus tincidunt ex tellus, vel maximus magna vestibulum vitae.
The header, content and border colors can be customized. Items have selective icon and active state.
Accordion and expandable also have shadow control for elevation effect.
-
The Good
Blondie (The Good) (Clint Eastwood) is a professional gunslinger who is out trying to earn a few dollars.
-
The Bad
Angel Eyes (The Bad) (Lee Van Cleef) is a hitman who always commits to a task and sees it through, as long as he is paid to do so.
-
The Ugly
Tuco (The Ugly) (Eli Wallach) is a wanted outlaw trying to take care of his own hide.