47 lines
1.5 KiB
TypeScript
47 lines
1.5 KiB
TypeScript
import ComponentCard from "../../../components/common/ComponentCard";
|
|
import PageMeta from "../../../components/common/PageMeta";
|
|
import { List, ListItem } from "../../../components/ui/list";
|
|
|
|
export default function ListPage() {
|
|
return (
|
|
<>
|
|
<PageMeta
|
|
title="React.js List Dashboard | TailAdmin - React.js Admin Dashboard Template"
|
|
description="This is React.js List Dashboard page for TailAdmin - React.js Tailwind CSS Admin Dashboard Template"
|
|
/>
|
|
<div className="space-y-5 sm:space-y-6">
|
|
<ComponentCard title="Unordered List">
|
|
<List variant="unordered">
|
|
<ListItem>Item 1</ListItem>
|
|
<ListItem>Item 2</ListItem>
|
|
<ListItem>Item 3</ListItem>
|
|
</List>
|
|
</ComponentCard>
|
|
|
|
<ComponentCard title="Ordered List">
|
|
<List variant="ordered">
|
|
<ListItem>First Item</ListItem>
|
|
<ListItem>Second Item</ListItem>
|
|
<ListItem>Third Item</ListItem>
|
|
</List>
|
|
</ComponentCard>
|
|
|
|
<ComponentCard title="Button List">
|
|
<List variant="button">
|
|
<ListItem variant="button" onClick={() => alert("Clicked Item 1")}>
|
|
Button Item 1
|
|
</ListItem>
|
|
<ListItem variant="button" onClick={() => alert("Clicked Item 2")}>
|
|
Button Item 2
|
|
</ListItem>
|
|
<ListItem variant="button" onClick={() => alert("Clicked Item 3")}>
|
|
Button Item 3
|
|
</ListItem>
|
|
</List>
|
|
</ComponentCard>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|
|
|