Remove Tailwind CSS configuration file

2026-01-16 08:52:10 +01:00 · 2025-06-28 00:23:23 +02:00
parent a6632d6dfc
commit 1be9ce9dd9
42 changed files with 3475 additions and 1028 deletions
--- a/components/charts/bar-chart.tsx
+++ b/components/charts/bar-chart.tsx
@ -0,0 +1,105 @@
+"use client";
+
+import {
+  BarChart,
+  Bar,
+  XAxis,
+  YAxis,
+  CartesianGrid,
+  Tooltip,
+  ResponsiveContainer,
+  Cell,
+} from "recharts";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+
+interface BarChartProps {
+  data: Array<{ name: string; value: number; [key: string]: any }>;
+  title?: string;
+  dataKey?: string;
+  colors?: string[];
+  height?: number;
+  className?: string;
+}
+
+const CustomTooltip = ({ active, payload, label }: any) => {
+  if (active && payload && payload.length) {
+    return (
+      <div className="rounded-lg border bg-background p-3 shadow-md">
+        <p className="text-sm font-medium">{label}</p>
+        <p className="text-sm text-muted-foreground">
+          <span className="font-medium text-foreground">
+            {payload[0].value}
+          </span>{" "}
+          sessions
+        </p>
+      </div>
+    );
+  }
+  return null;
+};
+
+export default function ModernBarChart({
+  data,
+  title,
+  dataKey = "value",
+  colors = [
+    "hsl(var(--chart-1))",
+    "hsl(var(--chart-2))",
+    "hsl(var(--chart-3))",
+    "hsl(var(--chart-4))",
+    "hsl(var(--chart-5))",
+  ],
+  height = 300,
+  className,
+}: BarChartProps) {
+  return (
+    <Card className={className}>
+      {title && (
+        <CardHeader>
+          <CardTitle className="text-lg font-semibold">{title}</CardTitle>
+        </CardHeader>
+      )}
+      <CardContent>
+        <ResponsiveContainer width="100%" height={height}>
+          <BarChart data={data} margin={{ top: 5, right: 30, left: 20, bottom: 5 }}>
+            <CartesianGrid 
+              strokeDasharray="3 3" 
+              stroke="hsl(var(--border))" 
+              strokeOpacity={0.3}
+            />
+            <XAxis
+              dataKey="name"
+              stroke="hsl(var(--muted-foreground))"
+              fontSize={12}
+              tickLine={false}
+              axisLine={false}
+              angle={-45}
+              textAnchor="end"
+              height={80}
+            />
+            <YAxis
+              stroke="hsl(var(--muted-foreground))"
+              fontSize={12}
+              tickLine={false}
+              axisLine={false}
+            />
+            <Tooltip content={<CustomTooltip />} />
+            <Bar 
+              dataKey={dataKey} 
+              radius={[4, 4, 0, 0]}
+              className="transition-all duration-200"
+            >
+              {data.map((entry, index) => (
+                <Cell 
+                  key={`cell-${index}`} 
+                  fill={colors[index % colors.length]}
+                  className="hover:opacity-80"
+                />
+              ))}
+            </Bar>
+          </BarChart>
+        </ResponsiveContainer>
+      </CardContent>
+    </Card>
+  );
+}