From 1825b7d9fe1a156c8fa36a2bea3844a01821d201 Mon Sep 17 00:00:00 2001
From: Peter Meier <peter.meier.1986@gmail.com>
Date: Mon, 18 May 2026 08:39:09 +0200
Subject: [PATCH] FilesBlock: compact single-row layout

Reduce padding, smaller icon, filename + ext/size on one line.
Description hidden on mobile, truncated on desktop.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 src/lib/components/blocks/FilesBlock.svelte | 22 +++++++++------------
 1 file changed, 9 insertions(+), 13 deletions(-)

diff --git a/src/lib/components/blocks/FilesBlock.svelte b/src/lib/components/blocks/FilesBlock.svelte
index ce5c90d..389e2ee 100644
--- a/src/lib/components/blocks/FilesBlock.svelte
+++ b/src/lib/components/blocks/FilesBlock.svelte
@@ -116,26 +116,22 @@
   {#if resolved.length === 0}
     <p class="text-sm text-stein-500">Keine Dateien verfügbar.</p>
   {:else}
-    <ul class="flex flex-col gap-2 list-none! p-0 m-0! ml-0">
+    <ul class="flex flex-col gap-1 list-none! p-0 m-0! ml-0">
       {#each resolved as f}
         <li class="list-none! ml-0">
           <a
             href={f.href}
-            class="group flex items-start gap-3 rounded-xs border border-stein-200 bg-white px-3 py-2 hover:border-stein-400 hover:bg-stein-50 transition-colors"
+            class="group flex items-center gap-2 rounded-xs border border-stein-200 bg-white px-2.5 py-1.5 hover:border-stein-400 hover:bg-stein-50 transition-colors"
             target="_blank"
             rel="noopener noreferrer"
           >
-            <Icon icon={f.iconName} class="size-6 shrink-0 text-stein-600" aria-hidden="true" />
-            <span class="flex flex-col min-w-0">
-              <span class="font-medium text-stein-900 group-hover:underline truncate">{f.label}</span>
-              {#if f.description}
-                <span class="text-sm text-stein-600">{f.description}</span>
-              {/if}
-              <span class="text-xs text-stein-500">
-                {#if f.ext}<span class="uppercase">{f.ext}</span>{/if}
-                {#if f.ext && f.sizeLabel} · {/if}
-                {#if f.sizeLabel}{f.sizeLabel}{/if}
-              </span>
+            <Icon icon={f.iconName} class="size-4 shrink-0 text-stein-500" aria-hidden="true" />
+            <span class="flex-1 min-w-0 text-sm text-stein-900 group-hover:underline truncate">{f.label}</span>
+            {#if f.description}
+              <span class="hidden md:block text-xs text-stein-400 truncate max-w-48">{f.description}</span>
+            {/if}
+            <span class="shrink-0 text-xs text-stein-400 tabular-nums">
+              {#if f.ext}<span class="uppercase">{f.ext}</span>{/if}{#if f.ext && f.sizeLabel} · {/if}{#if f.sizeLabel}{f.sizeLabel}{/if}
             </span>
           </a>
         </li>