Files
aerbim-ht-monitor/frontend/components/dashboard/ChartCard.tsx

41 lines
1.1 KiB
TypeScript

'use client'
import React from 'react'
interface ChartCardProps {
title: string
subtitle?: string
children: React.ReactNode
className?: string
}
const ChartCard: React.FC<ChartCardProps> = ({
title,
subtitle,
children,
className = ''
}) => {
return (
<div className={`bg-[#161824] rounded-[20px] p-6 ${className}`}>
<div className="flex items-start justify-between mb-6">
<div>
<h3 className="text-white text-base font-semibold mb-1">{title}</h3>
{subtitle && (
<p className="text-[#71717a] text-sm">{subtitle}</p>
)}
</div>
<div className="w-4 h-4">
<svg className="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" />
</svg>
</div>
</div>
<div className="h-[200px]">
{children}
</div>
</div>
)
}
export default ChartCard