fix(admin): address round-2 review concerns on ImportStatusCard
All checks were successful
CI / Unit & Component Tests (pull_request) Successful in 3m9s
CI / OCR Service Tests (pull_request) Successful in 20s
CI / Backend Unit Tests (pull_request) Successful in 3m1s
CI / fail2ban Regex (pull_request) Successful in 42s
CI / Semgrep Security Scan (pull_request) Successful in 19s
CI / Compose Bucket Idempotency (pull_request) Successful in 1m0s

- Use loop index as each key (handles duplicate filenames)
- Increase skipped filename font from text-xs to text-sm
- Add motion-safe guard to details chevron transition
- Replace text-warning with text-amber-900 to meet WCAG AA contrast

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-05-18 16:31:30 +02:00
parent 93da5914a8
commit b38b8c39b8

View File

@@ -55,10 +55,10 @@ function reasonLabel(code: string): string {
<p class="mt-1 text-xs text-green-800">{m.admin_system_import_status_done()}</p> <p class="mt-1 text-xs text-green-800">{m.admin_system_import_status_done()}</p>
</div> </div>
{#if importStatus.skipped > 0} {#if importStatus.skipped > 0}
<details class="mb-4 rounded-sm border border-warning/40 bg-warning/10 p-4 text-warning"> <details class="mb-4 rounded-sm border border-warning/40 bg-warning/10 p-4 text-amber-900">
<summary class="flex cursor-pointer list-none items-center gap-2"> <summary class="flex cursor-pointer list-none items-center gap-2">
<svg <svg
class="details-chevron h-4 w-4 shrink-0 transition-transform" class="details-chevron h-4 w-4 shrink-0 motion-safe:transition-transform"
viewBox="0 0 16 16" viewBox="0 0 16 16"
fill="none" fill="none"
stroke="currentColor" stroke="currentColor"
@@ -78,8 +78,10 @@ function reasonLabel(code: string): string {
</div> </div>
</summary> </summary>
<ul class="mt-3 space-y-1"> <ul class="mt-3 space-y-1">
{#each importStatus.skippedFiles as { filename, reason } (filename)} {#each importStatus.skippedFiles as skipped, i (i)}
<li class="font-mono text-xs text-ink-2">{filename}{reasonLabel(reason)}</li> <li class="font-mono text-sm text-ink-2">
{skipped.filename}{reasonLabel(skipped.reason)}
</li>
{/each} {/each}
</ul> </ul>
</details> </details>