konnosDashboard
LogDrainsCard.tsx34 lines · main
1import { Card } from 'ui'
2
3interface LogDrainsCardProps {
4 title: string
5 description: string
6 rightLabel?: string
7 icon: React.ReactNode
8 onClick: () => void
9}
10
11export const LogDrainsCard = ({
12 title,
13 description,
14 rightLabel,
15 icon,
16 onClick,
17}: LogDrainsCardProps) => {
18 return (
19 <button className="w-full h-full text-left" onClick={onClick}>
20 <Card className="p-6 cursor-pointer hover:bg-surface-200 hover:border-strong transition-colors h-48">
21 <div className="flex flex-col gap-5">
22 <div className="flex items-start justify-between w-full">
23 <div>{icon}</div>
24 <div className="text-xs text-foreground-light">{rightLabel}</div>
25 </div>
26 <div className="flex flex-col gap-1">
27 <h1 className="text-base">{title}</h1>
28 <p className="text-sm text-foreground-light leading-relaxed">{description}</p>
29 </div>
30 </div>
31 </Card>
32 </button>
33 )
34}