marcel/familienarchiv
1
0
Fork 0
Code Issues 121 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

fix(geschichten): scale list row typography to the full-width layout
All checks were successful
CI / Unit & Component Tests (pull_request) Successful in 3m57s
Details
CI / OCR Service Tests (pull_request) Successful in 23s
Details
CI / Backend Unit Tests (pull_request) Successful in 4m9s
Details
CI / fail2ban Regex (pull_request) Successful in 47s
Details
CI / Semgrep Security Scan (pull_request) Successful in 22s
Details
CI / Compose Bucket Idempotency (pull_request) Successful in 1m6s
Details

Browse Source 
Rows kept their compact sizes (15px titles, 12px excerpts/meta) after
the overview widened to max-w-7xl, leaving the text undersized in
full-width rows. Title is now text-lg, excerpt and meta text-sm; R-1
impl-ref updated.

Closes #802
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-06-10 22:53:40 +02:00
parent 264d7268c4
commit 50def73d80
3 changed files with 30 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/src/lib/geschichte/GeschichteListRow.svelte
View File

@@ -32,9 +32,9 @@ const authorName = $derived(formatAuthorName(geschichte.author));
>
{getInitials(authorName)}
</span>
<span class="font-sans text-xs leading-tight font-semibold text-ink">{authorName}</span>
<span class="font-sans text-sm leading-tight font-semibold text-ink">{authorName}</span>
{#if publishedAt}
<span class="font-sans text-xs text-ink-3">{publishedAt}</span>
<span class="font-sans text-sm text-ink-3">{publishedAt}</span>
{/if}
{#if isJourney}
<span
@@ -59,14 +59,14 @@ const authorName = $derived(formatAuthorName(geschichte.author));
>
{getInitials(authorName)}
</span>
<span class="font-sans text-xs font-semibold text-ink">{authorName}</span>
<span class="font-sans text-sm font-semibold text-ink">{authorName}</span>
{#if publishedAt}
<span class="ml-auto font-sans text-xs text-ink-3">{publishedAt}</span>
<span class="ml-auto font-sans text-sm text-ink-3">{publishedAt}</span>
{/if}
</div>
<div class="mb-1 flex items-center gap-1.5">
<h2 class="font-serif text-[15px] leading-snug text-ink group-hover:underline">
<h2 class="font-serif text-lg leading-snug text-ink group-hover:underline">
{geschichte.title}
</h2>
{#if isJourney}
@@ -82,7 +82,7 @@ const authorName = $derived(formatAuthorName(geschichte.author));
</div>
{#if geschichte.body}
<!-- plaintext for JOURNEY, sanitised-HTML→text for STORY; never {@html} -->
<p class="line-clamp-2 font-sans text-xs leading-relaxed text-ink-3">
<p class="line-clamp-2 font-sans text-sm leading-relaxed text-ink-3">
{plainExcerpt(geschichte.body, 150)}
</p>
{/if}

20
frontend/src/lib/geschichte/GeschichteListRow.svelte.spec.ts
View File

@@ -25,6 +25,26 @@ describe('GeschichteListRow', () => {
.toHaveTextContent('Die Reise nach Berlin');
});
it('row text sizes suit the full-width list: title text-lg, excerpt/meta text-sm (#802)', async () => {
render(GeschichteListRow, { props: { geschichte: baseRow() } });
const title = document.querySelector('h2');
expect(title!.className).toContain('text-lg');
expect(title!.className).not.toContain('text-[15px]');
const excerpt = document.querySelector('p');
expect(excerpt!.className).toContain('text-sm');
expect(excerpt!.className).not.toContain('text-xs');
const meta = Array.from(document.querySelectorAll('span')).filter((s) =>
s.textContent?.includes('Anna Schmidt')
);
expect(meta.length).toBeGreaterThan(0);
for (const span of meta) {
expect(span.className).toContain('text-sm');
}
});
it('shows no badge for STORY type', async () => {
render(GeschichteListRow, { props: { geschichte: baseRow({ type: 'STORY' }) } });
expect(document.querySelector('[data-testid="journey-badge"]')).toBeNull();