FileBrowser

public/index.css

@@ -12,15 +12,20 @@
 
 * { box-sizing: border-box; margin: 0; padding: 0; }
 
-html, body {
+html {
   min-height: 100%;
-  font-family: Arial, sans-serif;
-  font-size: 14px;
-  background: linear-gradient(to bottom, #dddddd -20%, var(--bg) 130%);
-  color: var(--text);
 }
 
-body { padding: 16px; }
+body {
+  min-height: 100vh;
+  font-family: Arial, sans-serif;
+  font-size: 14px;
+  /* background-attachment: fixed hält den Verlauf relativ zum Viewport —
+     verhindert das Wiederholen bei langen Seiten */
+  background: linear-gradient(to bottom, #dddddd -20%, var(--bg) 130%) fixed;
+  color: var(--text);
+  padding: 16px;
+}
 
 /* ===== HEADER ===== */
 .app-header {
@@ -28,6 +33,10 @@ body { padding: 16px; }
   align-items: baseline;
   gap: 12px;
   margin-bottom: 16px;
+  background: var(--panel);
+  border: 1px solid var(--border);
+  border-radius: 8px;
+  padding: 10px 16px;
 }
 .app-header h1 {
   font-size: 16px;
@@ -100,6 +109,11 @@ body { padding: 16px; }
   background: var(--active);
   border-color: var(--accent);
 }
+.prog-item.is-selected {
+  background: #1e293b;
+  border-color: #475569;
+}
+.prog-item.is-folder { font-style: italic; }
 .prog-item .prog-name {
   flex: 1;
   font-size: 13px;