nouveau-theatre-de-besancon/assets/css/src/events-grid.css
2024-09-10 18:43:19 +02:00

64 lines
1 KiB
CSS

.events-grid {
--padding-vertical: calc(var(--space-m) / 2);
}
.collapsable-sections + .events-grid {
border-top: none;
}
.events-grid h4 {
margin-bottom: calc(var(--space-m) / 2);
}
.event-card {
position: relative;
}
.event-card picture {
height: calc(((100vw - 9 * var(--space-m)) / 12) * var(--span));
margin-bottom: calc(var(--space-m) / 2);
}
.event-card__infos > div a {
max-width: 85%;
}
.event-card__infos .ticket {
z-index: 5;
margin-top: 0.3rem;
}
.event-card__infos > div {
display: flex;
justify-content: space-between;
align-items: flex-end;
column-gap: 2vw;
}
.event-card__infos > div:first-child {
margin-bottom: calc(var(--space-m) / 2);
}
.event-card__link {
position: absolute;
inset: 0;
z-index: 3;
}
@media screen and (max-width: 800px) {
.events-grid {
--padding-vertical: 10vw;
}
.events-grid h4 {
margin-bottom: 1.2rem;
}
.event-card {
margin-bottom: 1rem;
}
.event-card picture {
height: 70vw;
}
.event-card svg {
width: 2rem;
}
}