feat: Mobil genau ein Bereich, Umschalter oben links statt Splitter
Auf 375 px ist für zwei Bereiche kein Platz. Die stufenlose Aufteilung (D17) hat das nur verwaltet: Jede Stellung war ein Kompromiss, in dem beide Bereiche zu klein waren, und sinnvoll waren praktisch nur die Extreme — also genau das, was ein Umschalter direkt anbietet. Der Splitter kostete dabei dauerhaft eine zweite Titelzeile plus Griff. Jetzt: Diagramm ODER Text über die ganze Fläche, oben links ein Knopf zum Umschalten. Er zeigt das Ziel, nicht den Zustand — anders als der Modus-Wähler daneben, der drei Zustände hat; hier sieht man am ganzen Bildschirm, welcher gilt. Umgesetzt als zwei feste Knöpfe, je einer pro Titelzeile, die daher kein Icon wechseln müssen. Der Bereichstitel „DIAGRAMM" entfällt, der Dokumenten-Wähler steht neben dem Umschalter (er gehört zum Textbereich, D22), die übrigen Aktions-Knöpfe werden mitgeschaltet und bleiben komprimiert. Falle beim Bauen: Ein display:none-Panel misst sich zu null, und render() läuft bei jedem Tastendruck im Textbereich. Gemessen nach einer Eingabe bei verborgenem Diagramm: Pfad-Linie weg, null Stationspunkte, kein --stem-x. setMobilePane() zeichnet deshalb beim Umschalten neu (zum Diagramm dieselben vier Schritte wie applyLayout, zum Text renderLineNos) — danach wieder 48 px Pfadlänge, 5 Punkte, --stem-x 67,4px. Die Sprünge (D25) holen den nötigen Bereich selbst nach vorn. Zustand in werkbaum-ui gemerkt. Entfallen: --drow auf Mobil, --pmin-d/-e, syncPanelMins, setMobileDrow, Titelzeilen-Tippen. Desktop unverändert (nachgeprüft). SPEC §9, D17 (Nachtrag) und frontend/CLAUDE.md nachgezogen; paneToText/ paneToDiagram in allen neun Sprachen. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Fable 5
parent
ad2f3bab14
commit
ec086eb526
+13
-6
@@ -383,12 +383,19 @@ verworfene Elemente. Quelle sind ES-Module unter `src/`; `index.html` ist der
|
||||
der any-of-Teilbaum. `alignStems()` misst deshalb nach jedem `render()` (und
|
||||
in `applyLayout`) die Knotenmitte und setzt `--stem-x`; Fallback im CSS ist
|
||||
`50%`. Messwerte durch `zoom` zurückrechnen, sonst stimmt es nur bei 100 %.
|
||||
- Kleiner Bildschirm: `body.mobile` (per `matchMedia`, ≤ 640 px) stapelt
|
||||
Diagramm/Editor mit **stufenlosem** Splitter (kein Snap/Collapse wie auf
|
||||
Desktop): der Gutter-Drag ruft `setMobileDrow()` (klemmt `--drow` zwischen den
|
||||
Kopfhöhen `--pmin-d`/`--pmin-e`, per `syncPanelMins()` gemessen), ein Tipp auf
|
||||
eine Titelzeile maximiert das Panel. `applyLayout` ruft auf Mobil **kein**
|
||||
`applySplit` (das würde `--drow` löschen). Dazu eigener Legenden-Umschalter
|
||||
- Kleiner Bildschirm: `body.mobile` (per `matchMedia`, ≤ 640 px) zeigt **genau
|
||||
einen** Bereich — `body.pane-diagram` bzw. `body.pane-text`, umgeschaltet über
|
||||
je einen festen Knopf pro Titelzeile (`#paneToText`/`#paneToDiagram`,
|
||||
`setMobilePane()`); kein Splitter, keine Fenster-Buttons (D17-Nachtrag).
|
||||
**Der verborgene Bereich ist `display:none` und misst sich damit zu null** —
|
||||
`setMobilePane()` MUSS neu zeichnen: zum Diagramm hin dieselben vier Schritte
|
||||
wie `applyLayout` (`applyOptStairs`/`alignStems`/`drawCheapPath`/
|
||||
`drawDepLinks`), zum Text hin `renderLineNos()`. Ohne das ist nach dem Tippen
|
||||
im Textbereich die Pfad-Linie weg (gemessen). Die Sprünge (D25) schalten den
|
||||
Bereich selbst um: `revealEditor()` auf Text, `focusNodeOfCaret()` aufs
|
||||
Diagramm — **vor** dem Zentrieren. Zustand in `werkbaum-ui` (`mobilePane`),
|
||||
Variable oben bei `padView` deklariert (saveUI liest sie).
|
||||
`applyLayout` ruft auf Mobil **kein** `applySplit`. Dazu eigener Legenden-Umschalter
|
||||
(`#legendBtn`), schlanke Sprachwahl, Download-Overlay; Default Vollbild +
|
||||
Diagramm maximiert. Layout-CSS hängt an `body.mobile`, nicht an einer eigenen
|
||||
`@media`-Regel — beide Seiten müssen denselben 640-px-Schwellwert nutzen
|
||||
|
||||
Reference in New Issue
Block a user