website/site/styles/events.css

66 lines
899 B
CSS

.event {
display: flex;
flex-direction: row;
}
.event:hover {
border-bottom: 5px var(--hightlight) solid;
}
.event:hover>div {
padding-bottom: calc(0.5rem - 5px);
}
.event>div {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
white-space: nowrap;
}
.date {
width: 250px;
font-size: 0.9em;
overflow-x: hidden;
white-space: nowrap;
}
.title {
border-left: 2px solid var(--border);
font-weight: bold;
padding-left: 1rem;
padding-right: 0.5em;
}
.place {
font-size: 0.9em;
}
@media screen and (max-width: 1160px) {
.event {
flex-direction: column;
margin-bottom: 1rem;
border-left: 3px solid var(--border);
}
.event > div {
padding: 0 0.5rem;
white-space: normal;
}
.event:hover {
border-bottom: none;
}
.event:hover> div {
padding-bottom: 0;
}
.date {
width: 100%;
}
.title {
border-left: none;
}
}