feat(calendar): Kalenderwahl wieder als Ausklappliste, weiterhin mit Farbe
Die Plaketten aus dem vorigen Stand nahmen bei mehreren Kalendern viel Platz im Formular und liefen ueber mehrere Zeilen um. Also zurueck zur Ausklappliste -- aber nicht zurueck zum reinen Text. Ein natives <select> kam dafuer nicht in Frage: Dessen Eintraege lassen sich in keinem Browser verlaesslich einfaerben, und im zugeklappten Zustand schon gar nicht. Deshalb eine eigene Liste, die im Ruhezustand aussieht wie die anderen Felder daneben, aber den Farbpunkt des Kalenders traegt -- gefuellt fuer den gewaehlten, leerer Ring fuer die anderen, dieselbe Sprache wie in der Kalenderliste. Eine Falle dabei: Escape muss beim Schliessen der Liste angehalten werden. Sonst laeuft es weiter bis zum Fenster, wo der Termindialog lauscht, und macht gleich das ganze Formular zu -- mitsamt allem, was schon eingetippt war. Selbsttest weiter 36 gruen. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
1 parent
7a1f0837f5
commit
cc35161e74
2 files changed
+84
-40
No files matched your search
@@ -5,7 +5,7 @@ import {
|
||||
addDays, allDayISO, dateFromInput, eventDay, nthOfMonth, timedISO,
|
||||
toDateInput, toTimeInput, weekdayCodeOf, weekdayCodes,
|
||||
} from './dates'
|
||||
import { CalendarPicker, ColorSwatches, Toggle } from './controls'
|
||||
import { CalendarSelect, ColorSwatches, Toggle } from './controls'
|
||||
|
||||
interface Props {
|
||||
/** Fehlt er, entsteht ein neuer Termin. */
|
||||
@@ -215,7 +215,7 @@ export default function EventDialog({ event, defaultStart, calendars, calendarId
|
||||
Speichern die Sammlung, behält aber seine Kennung – für
|
||||
CalDAV-Clients derselbe Termin an neuer Adresse, nicht ein
|
||||
neuer. */}
|
||||
<CalendarPicker calendars={calendars} value={calId} onChange={setCalId} disabled={readOnly} />
|
||||
<CalendarSelect calendars={calendars} value={calId} onChange={setCalId} disabled={readOnly} />
|
||||
{!!event && calId !== calendarId && (
|
||||
<p style={{ margin: '6px 2px 0', fontSize: 12, color: 'var(--color-text-muted)', lineHeight: 1.4 }}>
|
||||
Wird beim Speichern nach „{calendars.find(c => c.id === calId)?.name}" verschoben
|
||||
|
||||
Reference in new issue
Block a user