commit a6e94fabed26a51152697f646706daa6b903004b
parent 16d15f72bdfd79ffc0ee47cdf20017cfa92db157
Author: notamitgamer-bot <noreply@github.com>
Date: Wed, 30 Sep 2026 09:49:03 +0000
ui: shared polish pass
- smaller, calmer headings
- sans-serif for inputs/buttons/chips/footer (mono kept for paths and code)
- neutral info banners, segmented destination picker, quiet list hover
- honour prefers-reduced-motion
Diffstat:
1 file changed, 22 insertions(+), 0 deletions(-)
diff --git a/app/templates/_styles.html b/app/templates/_styles.html
@@ -34,4 +34,26 @@
}
}
:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 2px; }
+
+/* ---- Shared polish (loads after page CSS, so it wins at equal specificity) ---- */
+body { font-family: var(--ui-font); line-height: 1.55; -webkit-font-smoothing: antialiased; }
+h1 { font-size: clamp(1.6rem, 3.2vw, 2.1rem) !important; font-weight: 600 !important; letter-spacing: -0.01em !important; line-height: 1.25; }
+/* UI text in sans; monospace stays for paths, file names and code */
+input, button, textarea, select, .btn, .folder-option, .folder-picker-label, .file-pill, .file-ext-tag, footer, .history-tab { font-family: var(--ui-font) !important; }
+/* Notices: neutral info banner instead of an accent bar */
+blockquote { border-left: 1px solid var(--ui-border) !important; background: var(--ui-surface); border-radius: var(--ui-radius); max-width: none !important; }
+/* Inputs and buttons */
+.filter-input, .search-input, .url-input { font-size: 0.95rem; background: var(--ui-bg); }
+.filter-input:focus, .search-input:focus, .url-input:focus { border-color: var(--ui-accent) !important; outline: 2px solid var(--ui-accent-bg); }
+.btn { font-weight: 500 !important; }
+.btn-primary { font-weight: 500 !important; }
+/* Destination chips become a compact segmented control */
+.folder-option { border-radius: var(--ui-radius) !important; font-size: 0.85rem !important; font-weight: 500 !important; background: var(--ui-bg); }
+.folder-option.active { background: var(--ui-accent-solid) !important; border-color: var(--ui-accent-solid) !important; color: #fff !important; }
+.file-pill { border-radius: var(--ui-radius) !important; font-weight: 500 !important; }
+/* Lists: quiet hover, tabular numbers for sizes */
+.list-item:hover { background: var(--ui-surface); }
+.item-size, .file-pill { font-variant-numeric: tabular-nums; }
+footer { color: var(--ui-muted); font-size: 0.85rem; }
+@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation-duration: 0.01ms !important; } }
</style>