matt/dashboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update saleschart card and chart colors

Browse Source
This commit is contained in:
Matt
2025-01-03 19:45:30 -05:00
parent 618c5a3ebb
commit e7c30e4ec5
1 changed files with 14 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
dashboard/src/components/dashboard/MiniSalesChart.jsx
View File

@@ -85,7 +85,7 @@ const MiniStatCard = memo(({
descriptionClass = "text-sm font-semibold text-gray-200" descriptionClass = "text-sm font-semibold text-gray-200"
}) => ( }) => (
<Card <Card
className={`w-full ${background || 'bg-gradient-to-br from-gray-900 to-gray-800 backdrop-blur-md'} ${ className={`w-full bg-gradient-to-br from-slate-700 to-slate-600 backdrop-blur-sm ${
onClick ? 'cursor-pointer transition-all hover:brightness-110' : '' onClick ? 'cursor-pointer transition-all hover:brightness-110' : ''
} ${!active ? 'opacity-50' : ''}`} } ${!active ? 'opacity-50' : ''}`}
onClick={onClick} onClick={onClick}
@@ -310,13 +310,12 @@ const MiniSalesChart = ({ className = "" }) => {
previousValue={formatCurrency(summaryStats.prevRevenue, false)} previousValue={formatCurrency(summaryStats.prevRevenue, false)}
trend={summaryStats.growth.revenue >= 0 ? "up" : "down"} trend={summaryStats.growth.revenue >= 0 ? "up" : "down"}
trendValue={`${Math.abs(Math.round(summaryStats.growth.revenue))}%`} trendValue={`${Math.abs(Math.round(summaryStats.growth.revenue))}%`}
colorClass="text-rose-200" colorClass="text-emerald-300"
titleClass="text-rose-100 font-bold text-md" titleClass="text-emerald-300 font-bold text-md"
descriptionClass="text-rose-200 text-md font-semibold" descriptionClass="text-emerald-300 text-md font-semibold"
icon={PiggyBank} icon={PiggyBank}
iconColor="text-rose-900" iconColor="text-emerald-900"
iconBackground="bg-rose-300" iconBackground="bg-emerald-300"
background="h-[150px] bg-gradient-to-br from-rose-900 to-rose-800"
onClick={() => toggleMetric('revenue')} onClick={() => toggleMetric('revenue')}
active={visibleMetrics.revenue} active={visibleMetrics.revenue}
/> />
@@ -326,13 +325,12 @@ const MiniSalesChart = ({ className = "" }) => {
previousValue={summaryStats.prevOrders.toLocaleString()} previousValue={summaryStats.prevOrders.toLocaleString()}
trend={summaryStats.growth.orders >= 0 ? "up" : "down"} trend={summaryStats.growth.orders >= 0 ? "up" : "down"}
trendValue={`${Math.abs(Math.round(summaryStats.growth.orders))}%`} trendValue={`${Math.abs(Math.round(summaryStats.growth.orders))}%`}
colorClass="text-indigo-200" colorClass="text-blue-300"
titleClass="text-indigo-100 font-bold text-md" titleClass="text-blue-300 font-bold text-md"
descriptionClass="text-indigo-200 text-md font-semibold" descriptionClass="text-blue-300 text-md font-semibold"
icon={Truck} icon={Truck}
iconColor="text-indigo-900" iconColor="text-blue-900"
iconBackground="bg-indigo-300" iconBackground="bg-blue-300"
background="h-[150px] bg-gradient-to-br from-indigo-900 to-indigo-800"
onClick={() => toggleMetric('orders')} onClick={() => toggleMetric('orders')}
active={visibleMetrics.orders} active={visibleMetrics.orders}
/> />
@@ -409,9 +407,9 @@ const MiniSalesChart = ({ className = "" }) => {
<Line <Line
yAxisId="revenue" yAxisId="revenue"
type="monotone" type="monotone"
dataKey="revenue"re dataKey="revenue"
name="Revenue" name="Revenue"
stroke="#f43f5e" stroke="#10b981"
strokeWidth={2} strokeWidth={2}
dot={false} dot={false}
/> />
@@ -422,7 +420,7 @@ const MiniSalesChart = ({ className = "" }) => {
type="monotone" type="monotone"
dataKey="orders" dataKey="orders"
name="Orders" name="Orders"
stroke="#6366f1" stroke="#3b82f6"
strokeWidth={2} strokeWidth={2}
dot={false} dot={false}
/> />