feat: Heute-Hervorhebung im Spaltenkopf, Termin-Symbole nach oben rechts
Zwei UI-Wuensche aus der Wochenansicht (TODO.md Block I). Der Spaltenkopf ist position: sticky und deckte mit --weekly-bg ab -- die Hervorhebung des heutigen Tages begann daher erst unterhalb von Wochentag und Datum. Jetzt faerbt sich der Kopf mit. Die Symbole sitzen statt unten rechts oben rechts. Damit Titel und Uhrzeit nicht darunter laufen, bekommen sie rechts Freiraum -- ueber :has(.event-icons-row) nur dort, wo ueberhaupt Symbole erscheinen. Fuer beide Darstellungen umgesetzt: Zeitraster und Liste. Verifiziert: npm run build Exit 0. Das Ergebnis ist rein visuell und daher nur im Browser wirklich pruefbar. v1.119.0 Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
parent
53de4017e5
commit
6fe4b69514
11
CHANGELOG.md
11
CHANGELOG.md
@ -2,6 +2,17 @@
|
|||||||
|
|
||||||
All notable changes to this project are documented in this file.
|
All notable changes to this project are documented in this file.
|
||||||
|
|
||||||
|
## [1.119.0] - 2026-09-07
|
||||||
|
|
||||||
|
### Changed
|
||||||
|
- Der laufende Tag ist jetzt auch im Spaltenkopf hervorgehoben, nicht mehr nur im
|
||||||
|
Spaltenkörper. Der Kopf ist `position: sticky` und deckte mit `--weekly-bg` ab, weshalb
|
||||||
|
die Färbung erst unterhalb von Wochentag und Datum begann.
|
||||||
|
- Die Symbole in Kalenderterminen (Wiederholung, Anbieter) sitzen jetzt oben rechts statt
|
||||||
|
unten rechts. Titel und Uhrzeit bekommen dort Freiraum, damit sich nichts überlappt —
|
||||||
|
über `:has(.event-icons-row)` nur bei Terminen, die überhaupt Symbole zeigen. Umgesetzt
|
||||||
|
für beide Darstellungen: Zeitraster und Liste.
|
||||||
|
|
||||||
## [1.118.2] - 2026-09-07
|
## [1.118.2] - 2026-09-07
|
||||||
|
|
||||||
### Fixed
|
### Fixed
|
||||||
|
|||||||
8
TODO.md
8
TODO.md
@ -281,8 +281,8 @@ Umgestellt auf `dataSources.query()`; die Suche filtert jetzt auf `data_source`
|
|||||||
|
|
||||||
## Block I — UI-Wünsche
|
## Block I — UI-Wünsche
|
||||||
|
|
||||||
### I1. Aktuellen Tag auch im Spaltenkopf hervorheben
|
### I1. Aktuellen Tag auch im Spaltenkopf hervorheben *(erledigt, bitte ansehen)*
|
||||||
- [ ] Hervorhebungsfarbe zusätzlich hinter Wochentagsname und Datum legen
|
- [x] Hervorhebungsfarbe zusätzlich hinter Wochentagsname und Datum gelegt
|
||||||
|
|
||||||
**Wunsch:** Der laufende Tag soll deutlicher auffallen. Aktuell ist nur der Spaltenkörper
|
**Wunsch:** Der laufende Tag soll deutlicher auffallen. Aktuell ist nur der Spaltenkörper
|
||||||
eingefärbt, der Kopfbereich mit "SEP 7 / MONDAY" bleibt weiß.
|
eingefärbt, der Kopfbereich mit "SEP 7 / MONDAY" bleibt weiß.
|
||||||
@ -296,8 +296,8 @@ offenbar mit eigenem Hintergrund. Der Wochentagsname hat bereits eine eigene Reg
|
|||||||
**Zu klären:** Der Kopf ist vermutlich `sticky` und braucht deshalb einen deckenden
|
**Zu klären:** Der Kopf ist vermutlich `sticky` und braucht deshalb einen deckenden
|
||||||
Hintergrund — die Farbe muss also gesetzt, nicht nur geerbt werden.
|
Hintergrund — die Farbe muss also gesetzt, nicht nur geerbt werden.
|
||||||
|
|
||||||
### I2. Symbole in Kalenderterminen nach oben rechts
|
### I2. Symbole in Kalenderterminen nach oben rechts *(erledigt, bitte ansehen)*
|
||||||
- [ ] `.event-icons-row` von unten rechts nach oben rechts verschieben
|
- [x] `.event-icons-row` nach oben rechts verschoben, Titel bekommt rechts Freiraum
|
||||||
|
|
||||||
**Wunsch:** Die kleinen Symbole (Wiederholung, Anbieter) sitzen unten rechts im Termin und
|
**Wunsch:** Die kleinen Symbole (Wiederholung, Anbieter) sitzen unten rechts im Termin und
|
||||||
sollen nach oben rechts.
|
sollen nach oben rechts.
|
||||||
|
|||||||
4
package-lock.json
generated
4
package-lock.json
generated
@ -1,12 +1,12 @@
|
|||||||
{
|
{
|
||||||
"name": "my-weekly-todo-list",
|
"name": "my-weekly-todo-list",
|
||||||
"version": "1.118.2",
|
"version": "1.119.0",
|
||||||
"lockfileVersion": 3,
|
"lockfileVersion": 3,
|
||||||
"requires": true,
|
"requires": true,
|
||||||
"packages": {
|
"packages": {
|
||||||
"": {
|
"": {
|
||||||
"name": "my-weekly-todo-list",
|
"name": "my-weekly-todo-list",
|
||||||
"version": "1.118.2",
|
"version": "1.119.0",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@auth/prisma-adapter": "^2.11.1",
|
"@auth/prisma-adapter": "^2.11.1",
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "my-weekly-todo-list",
|
"name": "my-weekly-todo-list",
|
||||||
"version": "1.118.2",
|
"version": "1.119.0",
|
||||||
"description": "A web-based weekly task management application that organizes to-dos and calendar events in a single, intuitive weekly view",
|
"description": "A web-based weekly task management application that organizes to-dos and calendar events in a single, intuitive weekly view",
|
||||||
"main": "index.js",
|
"main": "index.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
|||||||
@ -667,6 +667,12 @@ h3 {
|
|||||||
background-color: var(--weekly-today-highlight);
|
background-color: var(--weekly-today-highlight);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Der Spaltenkopf ist sticky und deckt deshalb mit --weekly-bg ab. Ohne diese Regel
|
||||||
|
endet die Hervorhebung des heutigen Tages unterhalb von Wochentag und Datum. */
|
||||||
|
.weekly-day-column.is-today .weekly-day-header {
|
||||||
|
background-color: var(--weekly-today-highlight);
|
||||||
|
}
|
||||||
|
|
||||||
.weekly-day-column.is-past .weekly-day-name,
|
.weekly-day-column.is-past .weekly-day-name,
|
||||||
.weekly-day-column.is-past .weekly-day-date {
|
.weekly-day-column.is-past .weekly-day-date {
|
||||||
color: var(--weekly-past-color, #a6a6a7);
|
color: var(--weekly-past-color, #a6a6a7);
|
||||||
@ -2569,6 +2575,13 @@ h3 {
|
|||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Gleiche Ueberlegung wie im Zeitraster: Die Symbole sitzen jetzt oben rechts, der Titel
|
||||||
|
braucht dort Freiraum. Nur bei Terminen, die ueberhaupt Symbole zeigen. */
|
||||||
|
.weekly-calendar-event:has(.event-icons-row) .weekly-calendar-event-title,
|
||||||
|
.weekly-calendar-event:has(.event-icons-row) .weekly-calendar-event-time {
|
||||||
|
padding-right: 34px;
|
||||||
|
}
|
||||||
|
|
||||||
.weekly-calendar-event-title {
|
.weekly-calendar-event-title {
|
||||||
color: var(--weekly-text);
|
color: var(--weekly-text);
|
||||||
font-family: var(--weekly-task-font, var(--weekly-font));
|
font-family: var(--weekly-task-font, var(--weekly-font));
|
||||||
@ -3098,6 +3111,10 @@ h3 {
|
|||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.time-slot-event:has(.event-icons-row) .event-title-row {
|
||||||
|
padding-right: 34px;
|
||||||
|
}
|
||||||
|
|
||||||
.time-slot-event .event-title-row {
|
.time-slot-event .event-title-row {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
@ -3182,7 +3199,7 @@ h3 {
|
|||||||
/* Event icons row (recurring, note, provider) */
|
/* Event icons row (recurring, note, provider) */
|
||||||
.event-icons-row {
|
.event-icons-row {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 2px;
|
top: 2px;
|
||||||
right: 4px;
|
right: 4px;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user