refactor(dashboard): align ReaderPersonChips cards with /persons overview style
Some checks failed
CI / OCR Service Tests (push) Has been cancelled
CI / Backend Unit Tests (push) Has been cancelled
CI / Unit & Component Tests (push) Has started running
CI / Unit & Component Tests (pull_request) Failing after 4m10s
CI / OCR Service Tests (pull_request) Successful in 35s
CI / Backend Unit Tests (pull_request) Failing after 3m33s

- rounded, px-4 py-6, shadow-sm, gap-4 — matches overview card sizing
- hover: left accent border + shadow-md (matches overview hover)
- avatar: h-12 w-12, font-bold (djb2 palette colors kept)
- name: font-bold, group-hover:underline
- doc count: neutral bg-muted chip instead of mint pill

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-05-08 18:21:24 +02:00
parent cc20583ae6
commit 2283f733cc
2 changed files with 21 additions and 15 deletions

View File

@@ -51,21 +51,23 @@ describe('ReaderPersonChips', () => {
expect(cls).toMatch(/min-h-\[44px\]/);
});
it('doc count renders as mint pill with bg-mint-soft', async () => {
it('doc count renders as neutral chip with bg-muted', async () => {
render(ReaderPersonChips, { persons: [person1] });
const link = page.getByRole('link', { name: /Anna Müller/ });
const el = (await link.element()) as HTMLElement;
const pill = el.querySelector('[class*="bg-mint-soft"]');
expect(pill).not.toBeNull();
expect(pill!.textContent).toContain('23');
const chip = el.querySelector('[class*="bg-muted"]');
expect(chip).not.toBeNull();
expect(chip!.textContent).toContain('23');
});
it('doc count pill has rounded-full class', async () => {
it('doc count chip has rounded-full and border-line classes', async () => {
render(ReaderPersonChips, { persons: [person1] });
const link = page.getByRole('link', { name: /Anna Müller/ });
const el = (await link.element()) as HTMLElement;
const pill = el.querySelector('[class*="rounded-full"]');
expect(pill).not.toBeNull();
const chip = el.querySelector('[class*="bg-muted"]');
expect(chip).not.toBeNull();
expect(chip!.className).toMatch(/rounded-full/);
expect(chip!.className).toMatch(/border-line/);
});
it('person grid uses grid layout', async () => {