main
8
Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
  dejanandClaude Opus 5
|
bada5db344 |
Menue nicht mehr abschneiden, Zeile teilt sich nach dem Ausblenden neu auf
Zwei Fehler aus dem Sparring, beide an der Diagrammkarte. **Das Optionsmenue war abgeschnitten.** Die Karte trug `overflow-hidden`, das Menue klappt aus dem Kopf heraus, und der zweite Eintrag war nur zur Haelfte zu sehen. Das Beschneiden ist entfallen; die runden Ecken brauchen es nicht, weil Kopf und Koerper 16 px Innenabstand haben und nichts an der Kante anliegt. **Nach dem Ausblenden blieb eine Luecke.** Die Zeilen waren ein Raster mit festen Spalten. Blendet man eine Karte aus, gibt ChartCard `null` zurueck, die Spalte bleibt aber stehen und die Nachbarkarte behaelt ihre zwei Drittel. Neu ist `ChartReihe` in PageContainer.tsx: eine Flexzeile statt eines Rasters. Die verbliebenen Karten verteilen den Platz unter sich neu, ohne dass jemand mitzaehlen muesste, wie viele gerade sichtbar sind. Nachgemessen auf /analytics: Der Zahlungsverlauf geht von 574 px auf 1164 px, sobald die Nachbarkachel verschwindet. Zehn Zeilen auf allen fuenf Analyse-Seiten umgestellt. `gleichHoch` haelt die Unterscheidung aus dem letzten Sparring fest: gestreckt nur, wo die Karten dieselbe Bauart haben. Beim Umbau eine Regression gebaut und durch Nachmessen gefunden: Aus 885/443 wurde 664/664. `[&>*]:flex-1` erzeugt den Selektor `.zeile > *`, und der ist spezifischer als eine Klasse am Kind, also verlor `xl:flex-[2]`. Jetzt `xl:flex-[2]!`, mit dem Grund als Kommentar an der Komponente. Nachgemessen nach der Aenderung, alle Zeilen: 885/443 wo zwei zu eins gewollt ist, 389/389 und 409/409 und 595/595 wo gleiche Hoehe gewollt ist. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01QPeZNwSeU7qG3RRCwaxEZX |
||
|
dejanandClaude Opus 5
|
6a0b36ddcc |
Geviertstriche aus Text, Kommentaren und Doku entfernen
467 Stellen. Nicht durch einen anderen Strich ersetzt, sondern durch das
Satzzeichen, das an der jeweiligen Stelle richtig ist: Doppelpunkt, wo eine
Erlaeuterung folgt; Komma, wo der Satz weiterlaeuft; Punkt, wo zwei
Hauptsaetze aneinanderstiessen. Ein Halbgeviertstrich waere nur derselbe
Griff mit kuerzerem Strich gewesen.
Regelbasiert ersetzt und danach nachgeprueft, weil eine Regel allein nicht
reicht. Gefunden und einzeln korrigiert:
- Eingeschobene Saetze mit Strichpaar. Nur der oeffnende Strich passte ins
Muster, der schliessende blieb als "—," stehen. Drei Stellen, jetzt mit
Klammern oder als eigener Satz.
- Doppelte Doppelpunkte, wo beide Striche eines Paars zu Doppelpunkten wurden
("Globale Regeln: Schrift, Groessen, Abstaende: kommen aus HiveGrid").
Sieben Stellen in Doku und Oberflaeche, jetzt in Klammern.
- Pfade, denen ein Komma statt eines Doppelpunkts folgte.
- Ausgerichtete Kommentartabellen, in denen der Strich eine Spalte war.
Nicht angefasst: drei Geviertstriche, die keine Prosa sind, sondern
Tabellenplatzhalter fuer "kein Wert" (Trichter, Auftraege, Kunden). Dort ist
der Strich die Angabe selbst; ihn zu entfernen liesse leere Zellen zurueck.
tsc, lint, build, verify:carbon und verify:layout laufen sauber.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01QPeZNwSeU7qG3RRCwaxEZX
|
||
|
dejanandClaude Opus 5
|
ab79c711ad |
Karten einer Zeile gleich hoch, Ueberschuss mittig verteilen
Aus dem Sparring: Bei duenner Datenlage riss die oben buendige Ausrichtung Loecher in die Seite. Nachgemessen auf /analytics mit Zeitraum "heute" und Gewerk "Heizung": "Umsatz nach Gewerk" 112 px neben "Zahlungseingang im Zeitverlauf" 427 px — 315 px Seitenhintergrund dazwischen. Das liest sich nicht als "wenig Daten", sondern als "etwas ist kaputt". Zwei Aenderungen, beide klein: - Der Kartenkoerper zentriert seinen Inhalt senkrecht. Der Ueberschuss geht je zur Haelfte nach oben und unten, statt unten abgeladen zu werden. Eine Stelle in ChartCard und eine in WidgetKachel — nicht in fuenf Diagrammen. - items-start faellt auf den Zeilen, die ausschliesslich Diagrammkarten tragen. Die Zeile mit den beiden Tabellen auf der Kundenseite bleibt oben buendig: Eine Tabelle hat ein natuerliches Ende und eine eigene Blaetterleiste, Strecken schiebt die nur nach unten. Die Karten bleiben dynamisch — keine feste Hoehe, mehr Inhalt laesst die Karte und mit ihr die Zeile weiter wachsen. Die Leere verschwindet nicht, sie zieht aus dem Seitenhintergrund in die Karte. Das ist der Unterschied zwischen einem Raster mit Luecken und einer Karte, in der gerade wenig steht. Nachgemessen nach der Aenderung: 427/427, 389/389 auf /analytics, 372/372 und 423/423 auf /dashboard. Dabei ist nebenbei die Leerflaeche unter dem Vertriebstrichter verschwunden, die vorher auffiel. In DESIGN-SYSTEM.md als Regel festgehalten. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01QPeZNwSeU7qG3RRCwaxEZX |
||
|
dejanandClaude Opus 5
|
e209c33916 |
Drei Stellen im Hover- und Ausrichtungsverhalten nachbessern
Aus dem Sparring, alle drei auch in Analytics wirksam. 1. Vertriebstrichter: Zeilen-Hervorhebung statt Ausgrauen der uebrigen Balken. Bisher setzte das Ueberfahren einer Zeile alle anderen Balken auf 45 % Deckkraft. Das war aus drei Gruenden falsch: Es liess fuenf von sechs Balken verblassen und las sich dadurch wie eine Auswahl statt wie ein Ueberfahren; es war in sich widerspruechlich, weil die Balken verblassten und die Namen daneben schwarz blieben; und Deckkraft traegt in diesem Diagramm bereits Bedeutung — der Balken kodiert einen Anteil, ihn heller zu machen heisst dort "weniger" und nicht "gerade nicht beruehrt". Jetzt bekommt die beruehrte Zeile einen Untergrund, die uebrigen bleiben unveraendert. Derselbe Untergrund wie in der Handlungsbedarf-Liste und in den Tabellen. Die Spur des aktiven Balkens wird weiss: neutral-50 und neutral-100 liegen nur fuenf Stufen auseinander, grau auf grau haette dem Balken den Bezugsrahmen genommen. 2. KPI-Karten einer Reihe auf gleiche Hoehe. Die Umsatzkarte war hoeher als ihre drei Nachbarn, weil sie als einzige eine Trendzeile mit Verlaufskurve traegt. Auf dem Dashboard steht zwischen Rasterzelle und Karte ein Link, und der reichte die Streckung des Rasters nicht durch. h-full auf der Karte. 3. Handlungsbedarf: Hover-Flaeche greift ueber den Inhalt hinaus. Der Untergrund endete hart am Pfeil — bei zwei Spalten besonders sichtbar, weil daneben 32 px Spaltenabstand ungefaerbt blieben. Jetzt acht Pixel Ueberstand und runde Ecken. Dabei mitgenommen: Der Trennstrich sass unten und brauchte eine Ausnahme fuer "die letzte Zeile" — die es bei zwei Spalten zweimal gibt. Die rechte Spalte behielt dadurch einen Strich, unter dem nichts mehr kam. Oben liegend ist die Ausnahme die erste Zeile jeder Spalte, und die steht immer an derselben Stelle, unabhaengig von der Anzahl der Eintraege. tsc, lint, build und verify:layout laufen sauber; Hover-Zustaende und Kartenhoehen nachgemessen statt begutachtet. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01QPeZNwSeU7qG3RRCwaxEZX |
||
|
dejanandClaude Opus 5
|
831a6ec9ad |
Dashboard als Widget-Flaeche bauen, Platzhalter ersetzen
Das Dashboard ist ein eigenes Feature neben Analytics: der Begruessungsbildschirm, nicht ein zweiter Analysebereich. Es zeigt heute nur Auswertungen, ist aber so gebaut, dass die spaeteren Bereiche als weitere Kacheln dazukommen und nicht als Umbau. Aufbau: Begruessung, vier Kennzahlen (je ein Link in die Analyse), Handlungsbedarf, vier Diagramme, drei reservierte Plaetze. Drei Entscheidungen, die dabei getroffen wurden: - Kein seitenweiter Filter. Jede Kachel traegt ihren eigenen Zeitraum und schreibt ihn in den Kopf. Das ist das Bedienmodell der Software (P11) und war die unbequemere Variante; eine Filterleiste haette beim Einbau alle Kacheln wieder auseinandergenommen. - Das Raster ist aus DashboardPage.tsx der Software uebernommen, nicht erfunden: dieselben Klassen, dieselbe Ableitung aus size.w und position.x. Der Software fehlt dafuer eine Zeile (position.x === 9); vermerkt in WidgetRaster.tsx. - Die reservierten Plaetze zeigen keine erfundenen Zahlen. "2 neue Antraege" aus dem Nichts liest sich in einer Abnahme wie eine fertige Funktion. Absichtliche Doppelung: Der Handlungsbedarf steht jetzt auf dem Dashboard und weiterhin auf der Analytics-Uebersicht. Ihn dort zu entfernen haette die offene Frage 5.1 mitentschieden. Dokumentiert in Abschnitt 3a des Scope-Papiers, aufzuloesen vor dem Port. Nebenbei zwei Fehler behoben, die auch Analytics betrafen: - Die Beschriftungen der Zeitachse liefen in schmalen Karten ineinander (fuenf Kalenderwochen brauchen 200px, eine halbe Kachel bei 768px hat 150). Recharts duennt sie jetzt selbst aus und haelt Anfang und Ende. - Das Zeitraum-Etikett im Kachelkopf schaltete per Viewport-Breakpoint, die Kachelbreite haengt aber am Raster. Bei 1024px blieben dem Untertitel 77px, und er lief ins Diagramm. Jetzt Container-Query. Die Wurzel leitet auf /dashboard statt /analytics — wie in der Software, wo nach der Anmeldung der Begruessungsbildschirm steht. tsc, lint, build, verify:carbon und verify:layout (7 Seiten x 9 Breiten) laufen sauber. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01QPeZNwSeU7qG3RRCwaxEZX |
||
|
dejanandClaude Opus 5
|
4cb0b5c799 |
feat(responsive): Breakpoints für 375–1920 px
Der Prototyp war auf Schreibtischbreiten gebaut. Bei 375 px lief die Seite um 306 px seitlich über, und dem Inhalt blieben 135 px, weil die Seitenleiste ihre vollen 240 px behielt. Seitenleiste (an HiveGrid abgeglichen, nicht erfunden): - Unterhalb 768 px faehrt sie als Schublade ueber den Inhalt. Derselbe Breakpoint, den die Software als MOBILE_BREAKPOINT fuehrt. - Hamburger links in der Kopfzeile, FeatherMenu, 32x32, md:hidden, vor dem Breadcrumb — wie SubframeAppShell ihn rendert. - Abdeckung dahinter, Escape schliesst, Fokus wandert beim Oeffnen auf den ersten Eintrag und kehrt beim Schliessen zum Ausloeser zurueck. - Fokusfalle mit Tab und Umschalt+Tab: Der Rahmen traegt role=dialog und aria-modal, ohne Falle waere das gegenueber einem Screenreader unwahr. - Der Einklapp-Knopf ist unterhalb md ausgeblendet. Er ragt bauartbedingt 17 px nach rechts heraus und blieb sonst als angeschnittener, wirkungsloser Rest bei x = -16 am Bildrand stehen — der gemeldete Fehler. Inhalte: Raster einspaltig ab 375 px, Seitenkopf mit Aktionen unter dem Titel und Icon-only, Zeitraum-Segment und Reiterstreifen waagerecht scrollend statt umbrechend (ein Segment ueber zwei Zeilen liest sich als zwei Steuerelemente), Filter-Panel auf volle Zeilenbreite, Tabellen mit eigenem Scrollbereich. Zwei abgeschnittene Fehler mitbehoben, die der Prueferer nicht sieht: - KPI-Label lief bei 1280 px um 5 px aus seinem Kasten; bricht jetzt um. Die Karte wird dadurch eine Zeile hoeher — der Preis fuer eine vollstaendig lesbare Beschriftung. - Randmarken der Auslastungsachse ragten je rund 10 px ueber die Spur. In sehr schmalen Karten entfaellt die Achse ganz; dort bleibt nur rund 40 px Spur, auf der selbst zwei Marken aneinanderstossen. verify-layout deckt jetzt 375-1920 px ab (vorher ab 1024) und meldet zusaetzlich Seitenueberlauf: ein waagerechter Scrollbalken auf Dokumentebene ist immer ein Fehler, nie ein Kompromiss. 7 Seiten x 9 Breiten gruen. Ab 1024 px ist der abgenommene Stand unveraendert — numerisch geprueft ueber die Bounding-Boxen aller Karten, Raster, Tabellen und Kopfelemente. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01QPeZNwSeU7qG3RRCwaxEZX |
||
|
dejanandClaude Opus 5
|
351a26efa4 |
fix(layout): kollidierenden und überlaufenden Text beseitigen
Gemeldeter Fehler: In der Ringlegende klebten Bezeichnung und Wert aneinander
("Gestellt189,1 T€"). Ursache war eine eigene Regression — beim Beheben der
abgeschnittenen Legendennamen war das truncate entfallen, ohne Ersatz. Damit
schrumpft die Namensspalte durch min-w-0 + grow auf null Breite, und der Text
läuft sichtbar über seinen Kasten hinaus:
1280 px Kastenbreite 0 px, Text 43 px darüber hinaus
1440 px Kastenbreite 25 px, Text 18 px darüber hinaus
1600 px unauffällig
Genau deshalb war es auf den Screenshots nicht zu sehen: Der Fehler tritt nur in
bestimmten Fensterbreiten auf.
Neu: scripts/verify-layout.mjs + npm run verify:layout. Lädt alle sechs Seiten in
sieben Breiten (1024–1920) und misst jede Textzeile über Range.getClientRects.
Gemessen wird auf Textzeilen, nicht auf Elementkästen — sonst melden benachbarte
Tabellenzellen mit Innenabstand falsch positiv. Mindestabstand 8 px = Carbon
$spacing-03. Der Lauf fand 110 Fehler; alle behoben:
- Ringlegende: Container-Query statt fester Zweispaltigkeit. Legende sitzt rechts
vom Ring, wenn Platz ist, sonst darunter — Carbon: "positioned to the right of
the chart when space is plentiful". Namen brechen um statt überzulaufen.
- Auslastungs-Achse: Beschriftungsdichte staffelt sich über drei Container-Stufen,
vorher überlappten die Zahlen in schmalen Karten um bis zu 16 px.
- Handlungsbedarf und Kennzahl-Labels: break-words statt Überlauf.
- Kartentitel und -untertitel: break-words, weil Dateipfade keine Leerzeichen
zum Umbrechen haben.
Dokumentiert als DESIGN-SYSTEM.md §9 mit Begründung, warum das ein gemessener
Prüfer sein muss und keine Sichtprüfung.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01QPeZNwSeU7qG3RRCwaxEZX
|
||
|
dejanandClaude Opus 5
|
b8bf987d0e |
feat(dashboard): Analytics-Dashboard als Gestaltungsvorlage zur Übergabe
UI/UX-Prototyp der Analytics-Dashboards in HiveGrid, fachlich auf einen SHK-/Handwerksbetrieb zugeschnitten. Ziel ist die Übergabe an die Entwicklung, nicht der Produktivbetrieb. Inhalt: sechs Seiten (Übersicht, Finanzen, Aufträge, Kunden, Team, Komponenten), 26 KPIs, neun Chart-Bausteine, Filtersystem mit seitenabhängiger Relevanz und ein deterministischer Demo-Datensatz (420 Kunden, 1.900 Aufträge, Stichtag 30.07.2026). Drei Quellen sind zusammengeführt: die fachliche Planung mit dem Branchenpartner (Januar 2026), die Subframe-Komponentenbibliothek aus dem HiveGrid-Pitch und IBM Carbon Data Visualization für die Diagrammregeln. Herkunft und bewusste Abweichungen stehen in docs/HERKUNFT.md. Dokumentation: README, HANDOVER (was echte Logik braucht), docs/DESIGN-SYSTEM, KPI-KATALOG, DATENMODELL, NAVIGATION, HERKUNFT, ZIELSYSTEM (Einbauort in HiveGrid Cloud) und LEITPLANKEN (welche Cloud-Screens als Vorbild taugen). Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01QPeZNwSeU7qG3RRCwaxEZX |