156 lines
8.3 KiB
Markdown
156 lines
8.3 KiB
Markdown
---
|
||
phase: quick-260916-jvj
|
||
plan: 01
|
||
subsystem: ui
|
||
tags: [react, tailwind, vitest, calendar, markdown]
|
||
|
||
requires:
|
||
- phase: quick-260916-htc
|
||
provides: Kalender-Widget Monatsraster mit Zähl-Plakette und Farbpunkt in „Nächste Termine“
|
||
- phase: quick-260916-j4f
|
||
provides: Termin-Tooltip per createPortal (Breite/Klemmung aus TOOLTIP_WIDTH_PX/TOOLTIP_EDGE_PX)
|
||
provides:
|
||
- Kalender-Plakette im Monatsraster trägt die Kalenderfarbe des frühesten Termins des Tages
|
||
- Tooltip-Zeilen mit Farbpunkt in derselben Reihenfolge/Rückfallregel wie „Nächste Termine“
|
||
- groupEventsByDate sortiert jede Tagesgruppe deterministisch nach Startzeit
|
||
- Aufzählungspunkte in .wmde-markdown-Ansichten (Was ist neu, Notiz-Vorschau) wieder sichtbar
|
||
affects: [dashboard-calendar, changelog-page, note-widget]
|
||
|
||
actuals:
|
||
tokens: 2855
|
||
tasks: 2
|
||
commits: 2
|
||
|
||
tech-stack:
|
||
added: []
|
||
patterns:
|
||
- "Klassenstring-Array + .filter(Boolean).join(' ') für bedingte Tailwind-Klassen (bereits durch cellClass etabliert, jetzt auch für die Plakette)"
|
||
- "Ungeschichtetes CSS in globals.css zum gezielten Überschreiben von Tailwind-Preflight-Regeln aus @layer base"
|
||
|
||
key-files:
|
||
created: []
|
||
modified:
|
||
- apps/web/src/components/dashboard/widgets/calendar-month.ts
|
||
- apps/web/src/components/dashboard/widgets/calendar-month.test.ts
|
||
- apps/web/src/components/dashboard/widgets/calendar-widget.tsx
|
||
- apps/web/src/components/dashboard/widgets/calendar-widget.test.tsx
|
||
- apps/web/src/app/globals.css
|
||
- CHANGELOG.md
|
||
|
||
key-decisions:
|
||
- "Plakettenfarbe = Farbe des frühesten Termins des Tages (Gruppe sortiert nach Start); bei mehreren Kalenderquellen an einem Tag keine Mischfarbe — bewusst einfach gehalten, vom Plan so vorgegeben"
|
||
- "groupEventsByDate sortiert jetzt selbst (vorher API-Reihenfolge unsortiert); Sortierung an einer Stelle hält Plakettenfarbe und Tooltip-Reihenfolge konsistent"
|
||
- "CSS-Block für .wmde-markdown-Listen bewusst ohne @layer, weil Preflight in @layer base liegt und ungeschichtetes CSS jede @layer-Regel unabhängig von Spezifität schlägt"
|
||
|
||
patterns-established:
|
||
- "Bedingte Badge-Farbe: style nur setzen wenn event.color vorhanden, sonst kein style-Attribut (Testbarkeit über style.backgroundColor === '')"
|
||
|
||
requirements-completed: [QUICK-260916-JVJ]
|
||
|
||
coverage:
|
||
- id: D1
|
||
description: "Kalender-Plakette im Monatsraster zeigt die Kalenderfarbe des frühesten Termins (weiße Schrift), ohne Farbe unverändert bg-primary"
|
||
requirement: "QUICK-260916-JVJ"
|
||
verification:
|
||
- kind: unit
|
||
ref: "apps/web/src/components/dashboard/widgets/calendar-widget.test.tsx#Test 3b: Plakette traegt die Kalenderfarbe des fruehesten Termins, Tooltip-Zeilen mit Farbpunkt"
|
||
status: pass
|
||
- kind: unit
|
||
ref: "apps/web/src/components/dashboard/widgets/calendar-widget.test.tsx#Test 3c: Plakette ohne Kalenderfarbe behaelt bg-primary"
|
||
status: pass
|
||
human_judgment: false
|
||
- id: D2
|
||
description: "Tooltip-Zeilen zeigen einen Farbpunkt je Termin (gleiche Rückfallregel wie die Liste), Reihenfolge nach Startzeit"
|
||
requirement: "QUICK-260916-JVJ"
|
||
verification:
|
||
- kind: unit
|
||
ref: "apps/web/src/components/dashboard/widgets/calendar-widget.test.tsx#Test 3b: Plakette traegt die Kalenderfarbe des fruehesten Termins, Tooltip-Zeilen mit Farbpunkt"
|
||
status: pass
|
||
human_judgment: false
|
||
- id: D3
|
||
description: "groupEventsByDate sortiert jede Tagesgruppe nach Startzeit aufsteigend"
|
||
requirement: "QUICK-260916-JVJ"
|
||
verification:
|
||
- kind: unit
|
||
ref: "apps/web/src/components/dashboard/widgets/calendar-month.test.ts#Test 2b: groupEventsByDate sortiert jede Tagesgruppe nach Start aufsteigend"
|
||
status: pass
|
||
human_judgment: false
|
||
- id: D4
|
||
description: "Aufzählungspunkte in .wmde-markdown-Ansichten (Was ist neu, Notiz-Vorschau) wieder sichtbar, Aufgabenlisten mit Kästchen bleiben ohne Punkt"
|
||
requirement: "QUICK-260916-JVJ"
|
||
verification: []
|
||
human_judgment: true
|
||
rationale: "CSS-Regeln sind über grep-Gates auf Vorhandensein geprüft, aber die visuelle Wirkung (Punkte sichtbar, Aufgabenlisten ohne Punkt) hat kein automatisiertes Browser-Rendering-Assert in diesem Auftrag — erfordert einen kurzen Blick in den Browser."
|
||
- id: D5
|
||
description: "CHANGELOG.md um zwei Stichpunkte ergänzt (Geändert: Plakette, Behoben: Aufzählungspunkte)"
|
||
requirement: "QUICK-260916-JVJ"
|
||
verification:
|
||
- kind: other
|
||
ref: "grep -qx -- '- Kalender-Widget: Plakette am Tag in der Farbe des Kalenders' CHANGELOG.md && grep -qx -- '- „Was ist neu“ und Notiz-Ansicht: Aufzählungspunkte wieder sichtbar' CHANGELOG.md"
|
||
status: pass
|
||
human_judgment: false
|
||
|
||
duration: 3min
|
||
completed: 2026-09-16
|
||
status: complete
|
||
---
|
||
|
||
# Quick 260916-jvj: Kalender-Plaketten in Kalenderfarbe, Aufzählungspunkte in Markdown-Ansichten Summary
|
||
|
||
**Kalender-Widget: Tages-Plakette und Tooltip-Zeilen tragen jetzt die Kalenderfarbe des frühesten Termins; Markdown-Listen (Was ist neu, Notiz-Vorschau) zeigen wieder Aufzählungspunkte**
|
||
|
||
## Performance
|
||
|
||
- **Duration:** 3 min (14:23:30 – 14:26:12)
|
||
- **Tasks:** 2/2
|
||
- **Files modified:** 6
|
||
|
||
## Accomplishments
|
||
- Zähl-Plakette im Monatsraster des Kalender-Widgets trägt die Farbe des Kalenders des frühesten Termins des Tages (weiße Schrift), ohne Farbe unverändert `bg-primary text-primary-foreground`
|
||
- Tooltip-Zeilen beim Überfahren eines Tages zeigen denselben Farbpunkt wie die Liste „Nächste Termine“ (Rückfall `var(--muted-foreground)`), in Startzeit-Reihenfolge
|
||
- `groupEventsByDate` sortiert jede Tagesgruppe jetzt selbst nach Start aufsteigend (vorher API-Reihenfolge unsortiert) — eine Stelle, an der Plakettenfarbe und Tooltip-Reihenfolge konsistent bleiben
|
||
- Aufzählungspunkte auf „Was ist neu“ und in der Notiz-Vorschau wieder sichtbar (Tailwind-Preflight `list-style: none` in `@layer base` wurde durch markdown.css nicht wiederhergestellt); Aufgabenlisten mit Kästchen bleiben ohne Punkt
|
||
- CHANGELOG.md um zwei Stichpunkte ergänzt
|
||
|
||
## Task Commits
|
||
|
||
Each task was committed atomically:
|
||
|
||
1. **Task 1: Kalender-Plakette in Kalenderfarbe, Farbpunkt im Tooltip, Sortierung je Tag + Tests** - `1e4ec30` (feat)
|
||
2. **Task 2: Aufzählungspunkte in Markdown-Ansichten (globals.css), CHANGELOG, voller Testlauf** - `c85cf9a` (fix)
|
||
|
||
_TDD-Task 1: RED (drei Tests geschrieben, liefen fehlschlagend) → GREEN (Implementierung, alle drei plus Bestand grün) in einem Commit — der Plan verlangte keine separaten RED/GREEN-Commits._
|
||
|
||
## Files Created/Modified
|
||
- `apps/web/src/components/dashboard/widgets/calendar-month.ts` - `groupEventsByDate` sortiert jede Tagesgruppe nach Start aufsteigend; Kopf-/Funktionskommentar ergänzt
|
||
- `apps/web/src/components/dashboard/widgets/calendar-month.test.ts` - Test 2b (unsortierte Eingabe → Tagesgruppe sortiert)
|
||
- `apps/web/src/components/dashboard/widgets/calendar-widget.tsx` - Plakette mit bedingtem `style={{ backgroundColor }}` + `text-white` bei Farbe, sonst `bg-primary text-primary-foreground` ohne style; Tooltip-Zeile mit Farbpunkt (`data-testid="tooltip-color-dot"`); Doc-Kommentar ergänzt
|
||
- `apps/web/src/components/dashboard/widgets/calendar-widget.test.tsx` - Test 3b (Farbe des frühesten Termins, Tooltip-Punkte, Reihenfolge) und Test 3c (ohne Farbe bleibt bg-primary)
|
||
- `apps/web/src/app/globals.css` - Block `.wmde-markdown`-Listenregeln am Dateiende mit deutschem Kommentar
|
||
- `CHANGELOG.md` - zwei neue Stichpunkte unter „Unveröffentlicht“ (Geändert, Behoben)
|
||
|
||
## Decisions Made
|
||
- Plakettenfarbe = Farbe des frühesten Termins des Tages; bei mehreren Kalenderquellen an einem Tag keine Mischfarbe (bewusst einfach, so im Plan vorgegeben)
|
||
- CSS-Block für die Markdown-Listen bewusst ungeschichtet (kein `@layer`), weil Tailwind-Preflight in `@layer base` liegt — ungeschichtetes CSS schlägt jede `@layer`-Regel unabhängig von Spezifität
|
||
|
||
## Deviations from Plan
|
||
|
||
None - plan executed exactly as written.
|
||
|
||
## Issues Encountered
|
||
None
|
||
|
||
## User Setup Required
|
||
|
||
None - no external service configuration required.
|
||
|
||
## Next Phase Readiness
|
||
- Kein Folgeauftrag angelegt; beide Nachträge aus der heutigen Browser-Prüfung (260916-htc/iex/j4f) sind damit geschlossen
|
||
- Optional: kurzer Blick in den Browser auf „Was ist neu“ und die Notiz-Vorschau, um D4 (visuelle Wirkung der CSS-Regeln) zu bestätigen
|
||
|
||
---
|
||
*Phase: quick-260916-jvj*
|
||
*Completed: 2026-09-16*
|
||
|
||
## Self-Check: PASSED
|