fix(calendar): constrain allday-cell width; change agenda event indicator to full-height bar
allday-cell gets min-width: 0; overflow: hidden so long event titles no longer stretch week-view column widths beyond their grid allocation. Agenda event color dot replaced by a 3px full-height left bar matching the dashboard upcoming-events style (align-items: stretch on parent).
This commit is contained in:
@@ -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);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user