duffyduckandClaude Opus 5.5
86ae896ae9
Pico scales the root font up to 125% on wide screens, which made the whole admin UI oversized. Pin it to 93.75% and tighten spacing tokens. The filter list is now a dense table-like list: switch, priority, name, condition chips, target folder, match stats and icon buttons on a single row (~35 rules fit on one screen instead of ~4). Warnings collapse into a ⚠ icon with tooltip; attachment and date conditions render as short chips; the full condition list is in the row tooltip; double-click opens the rule. Account picker, summary and main actions share one header row. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
84 lines
1.7 KiB
CSS
84 lines
1.7 KiB
CSS
/* Anpassungen über PicoCSS hinaus */
|
|
|
|
:root {
|
|
--app-bg: #f6f7f9;
|
|
--app-border: #e3e6ea;
|
|
/* Pico skaliert die Schrift auf breiten Bildschirmen bis 125% hoch —
|
|
für eine Verwaltungsoberfläche viel zu groß. Fest und kompakter. */
|
|
--pico-font-size: 93.75%;
|
|
--pico-line-height: 1.45;
|
|
--pico-spacing: 0.9rem;
|
|
--pico-form-element-spacing-vertical: 0.45rem;
|
|
--pico-form-element-spacing-horizontal: 0.7rem;
|
|
--pico-typography-spacing-vertical: 0.8rem;
|
|
--pico-block-spacing-vertical: 1rem;
|
|
--pico-block-spacing-horizontal: 1rem;
|
|
}
|
|
|
|
h1 { font-size: 1.6rem; }
|
|
h2 { font-size: 1.3rem; }
|
|
h3 { font-size: 1.1rem; }
|
|
h4 { font-size: 1rem; }
|
|
|
|
body {
|
|
background: var(--app-bg);
|
|
}
|
|
|
|
nav.container-fluid {
|
|
background: #fff;
|
|
border-bottom: 1px solid var(--app-border);
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
nav li {
|
|
padding-top: 0.6rem;
|
|
padding-bottom: 0.6rem;
|
|
}
|
|
|
|
nav .brand {
|
|
font-weight: 700;
|
|
letter-spacing: -0.01em;
|
|
}
|
|
|
|
nav .brand span {
|
|
color: var(--pico-primary);
|
|
}
|
|
|
|
nav a.active {
|
|
color: var(--pico-primary);
|
|
font-weight: 600;
|
|
box-shadow: inset 0 -2px 0 var(--pico-primary);
|
|
border-radius: 0;
|
|
}
|
|
|
|
main.container article {
|
|
border: 1px solid var(--app-border);
|
|
box-shadow: none;
|
|
}
|
|
|
|
footer {
|
|
margin-top: 2rem;
|
|
padding: 1rem 0;
|
|
text-align: center;
|
|
opacity: 0.6;
|
|
}
|
|
|
|
table .small, button.small {
|
|
padding: 0.25rem 0.5rem;
|
|
font-size: 0.85rem;
|
|
}
|
|
|
|
#status-message {
|
|
margin-top: 1rem;
|
|
padding: 1rem;
|
|
border-radius: 0.25rem;
|
|
background: var(--pico-muted-border-color);
|
|
}
|
|
|
|
dialog article {
|
|
max-height: 90vh;
|
|
overflow-y: auto;
|
|
}
|