style mobile calendar

This commit is contained in:
elisejakob
2024-05-13 00:59:29 +02:00
parent 7f0a5dccb1
commit ddc0413b8b
2 changed files with 13 additions and 6 deletions

View File

@ -58,7 +58,13 @@ const EventCalendar = ({ events }: { events: EventFragment[] }) => {
{Object.keys(eventsByDate[yearMonth]).map((week) => (
<div key={week} className={styles.calendarWeek}>
{Object.keys(eventsByDate[yearMonth][week]).map((day) => (
<div key={day} className={styles.calendarDay}>
<div
key={day}
className={`${styles.calendarDay} ${
eventsByDate[yearMonth][week][day].length === 0 &&
styles.empty
}`}
>
<h3>
{formatDate(
parse(day, "yyyy-MM-dd", new Date()),

View File

@ -91,9 +91,7 @@
}
.calendarDay {
display: grid;
grid-template-columns: repeat(3, 1fr);
column-gap: var(--spacing-gap-column);
min-height: 0;
padding: calc(var(--spacing-gap-column)/2) var(--spacing-sitepadding);
@ -101,8 +99,11 @@
display: none;
}
h3 {
grid-column: 1 / -1;
ul {
display: grid;
grid-template-columns: repeat(3, 1fr);
column-gap: var(--spacing-gap-column);
row-gap: var(--spacing-gap-row);
}
&:first-child,