Scarriffle/Calendarr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web: custom calendar dropdown in the event editor (shows group icon)

Browse Source 
A native <select> can't render the group icon SVG, so the calendar picker
is replaced with a styled dropdown: colour dot + group icon + name, grouped
by account/source with a "Groups" section. The native <select> is kept
hidden as the value holder + change-event source, so all existing save and
private/reminder-row logic is unchanged. Click-outside / Escape close it.

version v46 -> v47.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Scarriffle
2026-06-09 20:38:47 +02:00
parent c684a424eb
commit 367087450e
4 changed files with 178 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
frontend/index.html
View File

@@ -342,7 +342,16 @@
</div>
<div class="form-group">
<label>Kalender</label>
<select id="ev-calendar"></select>
<!-- Hidden native select stays the value holder + change-event source;
the custom dropdown below renders colour dots and group icons. -->
<select id="ev-calendar" class="cal-native-hidden"></select>
<div class="cal-select" id="ev-cal-select">
<button type="button" class="cal-select-trigger" id="ev-cal-trigger" aria-haspopup="listbox" aria-expanded="false">
<span class="cal-select-current" id="ev-cal-current"></span>
<svg class="cal-select-chevron" viewBox="0 0 24 24" width="18" height="18" fill="currentColor"><path d="M7 10l5 5 5-5z"/></svg>
</button>
<div class="cal-select-menu hidden" id="ev-cal-menu" role="listbox"></div>
</div>
</div>
<div class="form-row" id="ev-private-row" style="display:none">
<label class="toggle-label">