feat(web): group members in the sidebar + per-user member colours

Moved the group member filter from a top bar into the left sidebar (a
"Mitglieder" section that replaces the personal calendar list while a group is
active). Each member row has a checkbox (show/hide their events) and a colour
dot that opens the colour picker to recolour that member just for this viewer —
stored per-device in localStorage and applied over the server colour. Bumped v44.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Scarriffle
2026-06-01 20:32:45 +02:00
parent 817ce075d4
commit fc00bf9114
4 changed files with 73 additions and 56 deletions

View File

@@ -1840,31 +1840,9 @@ a { color: var(--primary); text-decoration: none; }
font-size: 14px;
color: var(--text-1);
}
/* Per-member filter bar under the group banner (hide individual people). */
.group-members-filter {
display: flex;
flex-wrap: wrap;
gap: 6px;
padding: 8px 16px;
background: color-mix(in srgb, var(--accent) 7%, var(--bg-app));
border-bottom: 1px solid var(--border);
}
.gmf-chip {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 4px 10px;
border-radius: 999px;
border: 1px solid var(--border);
background: var(--bg-surface);
color: var(--text-1);
font-size: 12.5px;
cursor: pointer;
transition: opacity var(--transition), background var(--transition);
}
.gmf-chip:hover { background: var(--bg-hover); }
.gmf-chip.gmf-off { opacity: 0.4; text-decoration: line-through; }
.gmf-dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
/* Group-member rows in the sidebar (colour dot = per-user colour, checkbox =
show/hide). Reuse the calendar-list item styling. */
.gm-row .gm-dot { cursor: pointer; }
.group-item-active {
background: var(--bg-surface);