edb/neuf-www
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style mobile calendar

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

8
web/src/components/events/EventContainer.tsx
View File

@ -58,7 +58,13 @@ const EventCalendar = ({ events }: { events: EventFragment[] }) => {
{Object.keys(eventsByDate[yearMonth]).map((week) => ( {Object.keys(eventsByDate[yearMonth]).map((week) => (
<div key={week} className={styles.calendarWeek}> <div key={week} className={styles.calendarWeek}>
{Object.keys(eventsByDate[yearMonth][week]).map((day) => ( {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> <h3>
{formatDate( {formatDate(
parse(day, "yyyy-MM-dd", new Date()), parse(day, "yyyy-MM-dd", new Date()),

11
web/src/components/events/eventContainer.module.scss
View File

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