38 lines
1.2 KiB
TypeScript
38 lines
1.2 KiB
TypeScript
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Checkbox } from "@/components/ui/checkbox";
|
|
|
|
export function Todo() {
|
|
const todos = [
|
|
{ text: "send e-mails", done: false },
|
|
{ text: "do the visuals", done: false },
|
|
{ text: "write the contract", done: false },
|
|
];
|
|
|
|
return (
|
|
<Card className='transition-transform duration-500 ease-in-out transform hover:scale-105'>
|
|
<CardHeader>
|
|
<CardTitle>Todo</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<div className='space-y-4'>
|
|
{todos.map((todo, i) => (
|
|
<div key={i} className='flex items-center space-x-2'>
|
|
<Checkbox id={`todo-${i}`} />
|
|
<label
|
|
htmlFor={`todo-${i}`}
|
|
className='text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70'
|
|
>
|
|
{todo.text}
|
|
</label>
|
|
</div>
|
|
))}
|
|
<Button className='w-full mt-4' variant='secondary'>
|
|
Add Todo
|
|
</Button>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
);
|
|
}
|