diff --git a/public/styles/calendar.css b/public/styles/calendar.css index cfb8108..d1a21eb 100644 --- a/public/styles/calendar.css +++ b/public/styles/calendar.css @@ -47,6 +47,10 @@ gap: var(--space-1); } +.cal-toolbar__nav .btn { + color: var(--color-text-secondary); +} + .cal-toolbar__label { font-size: var(--text-base); font-weight: var(--font-weight-semibold); @@ -217,6 +221,7 @@ cursor: pointer; color: var(--color-text-on-accent); line-height: 1.6; + filter: saturate(0.4); } .month-day__more { @@ -367,11 +372,12 @@ cursor: pointer; z-index: 1; line-height: 1.4; + filter: saturate(0.4); transition: filter var(--transition-fast); } .week-event:hover { - filter: brightness(0.9); + filter: saturate(0.4) brightness(0.9); } .week-event__title { @@ -474,7 +480,7 @@ .agenda-event { display: flex; - align-items: flex-start; + align-items: stretch; gap: var(--space-3); padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); @@ -488,11 +494,10 @@ } .agenda-event__color { - width: 10px; - height: 10px; + width: 3px; border-radius: var(--radius-full); flex-shrink: 0; - margin-top: var(--space-1); + filter: saturate(0.4); } .agenda-event__body { @@ -599,6 +604,7 @@ height: 4px; border-radius: var(--radius-full); margin-bottom: var(--space-3); + filter: saturate(0.4); } .event-popup__title { @@ -636,6 +642,8 @@ .allday-cell { border-left: 1px solid var(--color-border-subtle); padding: 2px; + min-width: 0; + overflow: hidden; } .allday-event { @@ -649,4 +657,27 @@ text-overflow: ellipsis; margin-bottom: var(--space-0h); cursor: pointer; + filter: saturate(0.4); +} + +/* -------------------------------------------------------- + * Kalender-Name-Label (Agenda, Popup) + * -------------------------------------------------------- */ +.event-cal-label { + display: inline-flex; + align-items: center; + gap: 4px; + font-size: var(--text-xs); + color: var(--color-text-disabled); +} + +.event-cal-label::before { + content: ''; + display: inline-block; + width: 7px; + height: 7px; + border-radius: var(--radius-full); + background: var(--cal-color, currentColor); + flex-shrink: 0; + filter: saturate(0.4); }