Scarriffle/Vorrania
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web: Anteils-Ringe – Ring bleibt stehen, nur Legende scrollt; Ohne-MHD-Schalter in die Konfig

Browse Source 
Bei vielen Kategorien scrollte die ganze Karte (Ring wanderte weg). Jetzt fuellt
die Legende die Hoehe des Ring-Bereichs und scrollt in sich; der Ring bleibt
mittig fixiert.

Ablauf-Anteile: der Ohne-MHD-Schalter sass als Checkbox auf der Karte (localStorage).
Jetzt als boolean-Konfig im Zahnrad-Dialog (Vorgabe an), wie die anderen Optionen.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Scarriffle
2026-07-30 17:47:46 +02:00
parent 9b0771ae0e
commit 2f6c88ce08
2 changed files with 9 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
web/src/styles.css
View File

@@ -778,13 +778,10 @@ select.zeitraum:hover { color: var(--text); }
gap: var(--sp-4); flex-wrap: wrap;
flex: 1; min-height: 0;
}
/* Ablauf-Ring mit „Ohne MHD"-Umschalter darueber; der Ring fuellt den Rest. */
.ring-mit-schalter { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.ring-schalter { flex: 0 0 auto; justify-content: flex-end; margin: 0 0 4px; font-size: 0.78rem; color: var(--muted); }
/* Der Umschalter ist eine Karten-Einstellung: nur sichtbar, wenn man das
Dashboard gerade bearbeitet. Die Wahl wirkt trotzdem in der normalen Ansicht. */
.ring-mit-schalter .ring-schalter { display: none; }
.dash-grid.editing .ring-mit-schalter .ring-schalter { display: flex; }
/* Bei vielen Kategorien (Detailansicht) soll der Ring stehen bleiben und nur die
Legende scrollen – nicht die ganze Karte. Deshalb füllt die Legende die Höhe
des Ring-Bereichs und scrollt in sich; der Ring bleibt mittig fixiert. */
.chart-donut .chart-legend { align-self: stretch; min-height: 0; overflow-y: auto; }
.donut-svg { width: 160px; height: 160px; flex: 0 0 auto; }
.donut-svg circle { transition: stroke-width 120ms ease; cursor: default; }
.donut-value { font-size: 20px; font-weight: 680; fill: var(--text); }