Lists are continuous, vertical indexes of text or images
Basic
A basic list of items with title
and subtitle
.
Header
A vs-list-header
separator with custom color
.
Icon
The list items and the headers can have a icon
as well.
TIP Vuesax uses the > Google Material Icons font library by default. For a list of all available icons, visit the official > Material Icons page . Other icon libraries can be used by providing the class for the respective pack in the icon-pack property. ex. FA4 uses fa or fas, FA5 uses fas, far, or fal.
Content
You can add custom content to the item. It will be pushed to the right side.
Avatar
You can implement an avatar in the list with the
slot="avatar"
by putting a [vs-avatar] component (/components/avatar.html)
SJ Matt XAPI
Name Type Parameters Description default color String RGB, HEX, primary, success, danger, warning, dark Component color primary icon String Material icons An icon to show icon-pack String Icon Pack Class Name Icon Pack to be used. If not set, icon will default to Material Icons. ex. FA4 uses fa or fas, FA5 uses fas, far, or fal. material-icons title String List primary text subtitle String List secondary text slot=”avatar” Slot Slot to add the avatar in the list