Lists (legacy)
For a consistent visual style use the list classes.
Gunnel v17 no longer contains list classes. These are easily reproducible with standard tailwind classes.
For information about migrating, see Upgrade to v17
Simple list
For a simple list of text items use the list and list-item classes.
Condensed
For a tighter list add the list_condensed class.
Clickable
To indicate that an item can be clicked add the list_clickable class.
Moving and sorting
Read more in drag and drop pattern.
List of cards
List with action buttons
To add secondary action buttons use the list-item__actions class and RoundButton component.
List with icons
List with two lines
List with two lines and icons
List with two lines and avatars (users)
To show a list of users. The primary text should be the user’s real name if available, the secondary text the email address.
For selecting a user / credential
Add an radio button since else it can be hard to understand it’s clickable.