improved display of event color-codes

This commit is contained in:
eclipse 2025-09-02 20:37:07 +02:00
parent 337b90e521
commit 8290a50c2e

View File

@ -387,9 +387,6 @@ article form {
50% { clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); }
}
.events .tr-muted {
color: var(--pico-muted-color);
}
#events-legend {
width: 100%;
@ -397,28 +394,46 @@ article form {
justify-content: center;
}
span.babelsberger-lesesalon, .babelsberger-lesesalon .event-info {
background-color: var(--tr-events-color-bls);
}
span.andere-welten, .andere-welten .event-info {
background-color: var(--tr-events-color-paw);
}
/* event list */
.event-info {
vertical-align: top;
max-width: 240px;
.events {
.tr-muted {
color: var(--pico-muted-color);
}
tr {
background: linear-gradient(100deg, color-mix(in srgb, var(--pico-background-color) 90%, white), 25%, var(--pico-background-color));
td {
background: unset;
border-bottom: none;
}
}
tr.babelsberger-lesesalon {
background: linear-gradient(100deg, var(--tr-events-color-bls), 25%, var(--pico-background-color));
}
tr.andere-welten {
background: linear-gradient(100deg, var(--tr-events-color-paw), 25%, var(--pico-background-color));
}
.event-info {
vertical-align: top;
max-width: 240px;
}
}
#content-body .event-detail {
height: 100%;
vertical-align: top;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: flex-start;
align-items: stretch;
gap: var(--pico-block-spacing-horizontal);
img.event-flyer {
max-height: calc(var(--tr-card-height) * .666);
max-width: calc(var(--tr-smallest-width) * .666);
@ -426,6 +441,14 @@ span.andere-welten, .andere-welten .event-info {
}
}
span.babelsberger-lesesalon {
background: linear-gradient(100deg, color-mix(in srgb, var(--tr-events-color-bls) 75%, transparent), 75%, var(--pico-background-color));
}
span.andere-welten {
background: linear-gradient(100deg, color-mix(in srgb, var(--tr-events-color-paw) 75%, transparent), 75%, var(--pico-background-color));
}
/* flex settings for layout of cards */
.cards {