layer-systems/website
1
0
Fork 0
mirror of https://github.com/layer-systems/website.git synced 2026-09-16 16:29:29 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: add overflow handling to charts and dashboard components for better layout

Browse Source
This commit is contained in:
highperfocused
2026-01-01 21:00:30 +01:00
parent 38541d1635
commit 8f75803797
4 changed files with 15 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/dashboard/EventKindsChart.tsx
View File

@@ -156,7 +156,7 @@ export function EventKindsChart() {
}
return (
<Card className="flex flex-col">
<Card className="flex flex-col overflow-hidden">
<CardHeader className="items-center pb-0">
<CardTitle>Event Kinds Distribution</CardTitle>
<CardDescription>Your top 5 event types</CardDescription>

6
src/components/dashboard/RecentActivityChart.tsx
View File

@@ -133,15 +133,15 @@ export function RecentActivityChart() {
}
return (
<Card>
<Card className="overflow-hidden">
<CardHeader>
<CardTitle>Recent Activity</CardTitle>
<CardDescription>
Your event activity over the last 30 days
</CardDescription>
</CardHeader>
<CardContent>
<ChartContainer config={chartConfig} className="h-[250px] w-full">
<CardContent className="overflow-x-auto">
<ChartContainer config={chartConfig} className="h-[250px] w-full min-w-[300px]">
<BarChart data={chartData} accessibilityLayer>
<CartesianGrid strokeDasharray="3 3" vertical={false} />
<XAxis

10
src/components/dashboard/RecentActivityList.tsx
View File

@@ -89,16 +89,16 @@ export function RecentActivityList({ pubkey }: RecentActivityListProps) {
key={event.id}
className="flex items-start justify-between border-b pb-3 last:border-0"
>
<div className="space-y-1 flex-1 min-w-0">
<div className="flex items-center gap-2">
<Badge variant="secondary" className="text-xs">
<div className="space-y-1 flex-1 min-w-0 overflow-hidden">
<div className="flex items-center gap-2 flex-wrap">
<Badge variant="secondary" className="text-xs shrink-0">
{kindName}
</Badge>
<span className="text-xs text-muted-foreground">
<span className="text-xs text-muted-foreground shrink-0">
{relativeTime}
</span>
</div>
<p className="text-sm text-muted-foreground line-clamp-2">
<p className="text-sm text-muted-foreground line-clamp-2 break-all">
{contentPreview}
</p>
</div>