p-sw/CodexDash
1
0
Fork 0
Code Issues Releases Wiki Activity

refactor: stack dashboard summary cards

Browse Source
This commit is contained in:
Shinwoo PARK
2026-05-09 16:25:12 +09:00
parent fa650562ce
commit 89983fd84b
2 changed files with 47 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
apps/web/src/App.tsx
View File

@@ -642,8 +642,8 @@ function Dashboard() {
</div>
</div>
<div className="grid gap-4 md:grid-cols-3 xl:grid-cols-4">
<Card className="md:col-span-2">
<div className="grid gap-4 xl:grid-cols-[minmax(0,2fr)_minmax(16rem,1fr)] xl:items-stretch">
<Card className="h-full">
<CardHeader>
<CardTitle>Unified capacity</CardTitle>
</CardHeader>
@@ -676,6 +676,7 @@ function Dashboard() {
</CardContent>
</Card>
<div className="grid gap-4 xl:grid-rows-3">
{[
{
title: 'Connected sessions',
@@ -693,7 +694,7 @@ function Dashboard() {
tone: 'text-rose-300',
},
].map((item) => (
<Card key={item.title}>
<Card key={item.title} className="h-full">
<CardHeader>
<CardDescription>{item.title}</CardDescription>
<CardTitle className={item.tone}>
@@ -703,6 +704,7 @@ function Dashboard() {
</Card>
))}
</div>
</div>
<div className="mt-6 grid gap-6 xl:grid-cols-[1.15fr_0.85fr]">
<Card className="min-w-0">

17
apps/web/test/dashboard-summary-layout.test.js Normal file
View File

@@ -0,0 +1,17 @@
import { describe, expect, test } from 'bun:test';
import { readFileSync } from 'node:fs';
import { join } from 'node:path';
const appSource = readFileSync(join(import.meta.dir, '../src/App.tsx'), 'utf8');
describe('dashboard summary layout', () => {
test('stacks the session summary cards vertically beside unified capacity on desktop', () => {
expect(appSource).toContain(
'className="grid gap-4 xl:grid-cols-[minmax(0,2fr)_minmax(16rem,1fr)] xl:items-stretch"',
);
expect(appSource).toContain('className="h-full"');
expect(appSource).toContain('className="grid gap-4 xl:grid-rows-3"');
expect(appSource).not.toContain('className="grid gap-4 md:grid-cols-3 xl:grid-cols-4"');
expect(appSource).not.toContain('className="md:col-span-2"');
});
});