fix: prevent mobile dashboard overflow

This commit is contained in:
2026-05-09 16:21:08 +09:00
parent 7b0315940b
commit cd586c0c73
3 changed files with 35 additions and 9 deletions

View File

@@ -2,15 +2,17 @@ import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/com
export function JsonViewer({ title, description, value }: { title: string; description: string; value: unknown }) {
return (
<Card className="border-white/8 bg-slate-900/80">
<Card className="min-w-0 border-white/8 bg-slate-900/80">
<CardHeader>
<CardTitle>{title}</CardTitle>
<CardDescription>{description}</CardDescription>
</CardHeader>
<CardContent>
<pre className="max-h-80 overflow-auto rounded-2xl bg-black/30 p-4 text-xs leading-6 text-slate-300">
{JSON.stringify(value, null, 2)}
</pre>
<CardContent className="min-w-0">
<div className="min-w-0 max-h-80 overflow-x-auto overflow-y-auto rounded-2xl bg-black/30">
<pre className="min-w-0 whitespace-pre-wrap break-all p-4 text-xs leading-6 text-slate-300">
{JSON.stringify(value, null, 2)}
</pre>
</div>
</CardContent>
</Card>
);