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

fix(document-row): align contributor circles with progress ring

Browse Source 
The ProgressRing renders SVG + percentage label as a flex column (~52px
total). With items-center, the contributor circles aligned to the middle
of the full block, placing them 8px below the ring center. Changed to
items-start on the container and wrapped ContributorStack in h-9 (36px =
SVG height) flex items-center so both circles center at the same 18px.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-20 09:55:50 +02:00
committed by marcel
parent 33ada55f12
commit eb3a54b19c
1 changed files with 8 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/src/lib/components/DocumentRow.svelte
View File

@@ -140,9 +140,11 @@ function safeTagColor(color: string | null | undefined): string {
<div>
{doc.documentDate ? formatDate(doc.documentDate) : '—'}
</div>
<div class="flex items-center gap-2">
<div class="flex items-start gap-2">
<ProgressRing percentage={item.completionPercentage} />
<ContributorStack contributors={item.contributors} hasMore={hasMore} />
<div class="flex h-9 items-center">
<ContributorStack contributors={item.contributors} hasMore={hasMore} />
</div>
</div>
</div>
</div>
@@ -172,9 +174,11 @@ function safeTagColor(color: string | null | undefined): string {
{/if}
</span>
</div>
<div class="flex items-center gap-2">
<div class="flex items-start gap-2">
<ProgressRing percentage={item.completionPercentage} />
<ContributorStack contributors={item.contributors} hasMore={hasMore} />
<div class="flex h-9 items-center">
<ContributorStack contributors={item.contributors} hasMore={hasMore} />
</div>
</div>
</div>
</div>