Card with List
Examples
Latest Customers
View allNeil Sims
email@windster.com
AdvisorBonnie Green
email@windster.com
DeveloperMichael Gough
email@windster.com
Marketing
<script>
import { ListCard }from '$lib/index';
let lists = [
{
img: {
src: "/images/profile-picture-1.jpeg",
alt: "Neil Sims",
},
field1: "Neil Sims",
field2: "email@windster.com",
field3: "Advisor",
},
{
img: {
src: "/images/profile-picture-2.jpeg",
alt: "Bonnie Green",
},
field1: "Bonnie Green",
field2: "email@windster.com",
field3: "Developer",
},
{
img: {
src: "/images/profile-picture-3.jpeg",
alt: "Michael Gough",
},
field1: "Michael Gough",
field2: "email@windster.com",
field3: "Marketing",
},
];
let title = 'Latest Customers';
let action ={
name: "View all",
href: "/"
}
</script>
Props
The component has the following props, type, and default values. See types page for type information.
Name | Type | Default |
---|---|---|
lists | ListCardType[] | |
title | string | 'Latest Customers' |
action | LinkType | |
divClass | string | 'p-4 max-w-md bg-white rounded-lg border shadow-md sm:p-8 dark:bg-gray-800 dark:border-gray-700' |