feat: add hakken themes and schedule #19

Merged
b12f merged 4 commits from hakken-add-themes-and-schedule into main 2023-12-29 11:09:34 +00:00
3 changed files with 11 additions and 95 deletions
Showing only changes of commit ade480125c - Show all commits

View file

@ -9,18 +9,6 @@ dates:
This hakken will include our yearly general assembly. This is the perfect opportunity to get to know the internals of the organization, and to get involved! This hakken will include our yearly general assembly. This is the perfect opportunity to get to know the internals of the organization, and to get involved!
de: | de: |
Auf diesem hakken wird die Mitgliederversammlung stattfinden. Dies ist die perfekte Gelegenheit pub.solar n.e.V. als Organisation kennenzulernen und mitzumachen! Auf diesem hakken wird die Mitgliederversammlung stattfinden. Dies ist die perfekte Gelegenheit pub.solar n.e.V. als Organisation kennenzulernen und mitzumachen!
extraSchedule:
- day: friday
time: '20:00'
id: cm
title:
en: Critical Mass
de: Critical Mass
- day: saturday
time: '14:00'
title:
en: General Assembly pub.solar n.e.V.
de: Mitgliederversammlung pub.solar n.e.V.
- name: Spring 2024 - name: Spring 2024
theme: Push for privacy theme: Push for privacy
@ -108,9 +96,6 @@ strings:
theme: theme:
en: 'Theme' en: 'Theme'
de: 'Thema' de: 'Thema'
schedule:
en: 'Schedule'
de: 'Zeitplan'
months: months:
- en: 'January' - en: 'January'
de: 'Januar' de: 'Januar'
@ -136,32 +121,3 @@ strings:
de: 'November' de: 'November'
- en: 'December' - en: 'December'
de: 'Dezember' de: 'Dezember'
baseSchedule:
- day: friday
time: '13:12'
id: start
title:
en: Opening
de: Eröffnung
- day: friday
time: '17:30'
id: cm
title:
en: Critical Mass
de: Critical Mass
- day: sunday
time: '15:30'
id: wrapup
title:
en: Wrap-up get-together
de: Abschluss-Treffen
- day: sunday
time: '16:20'
id: end
title:
en: Official end
de: Offizielles Ende

View file

@ -48,15 +48,13 @@ export default ({ data, lang, className }) => {
const dates = data.dates; const dates = data.dates;
const t = (o) => o?.[lang] || ''; const t = (o) => o?.[lang] || '';
console.log(dates);
return <div return <div
id={`dates-list-${lang}`} id={`dates-list-${lang}`}
className={`ps-hakken-dates ${className}`} className={`ps-hakken-dates ${className}`}
> >
<p>{t(strings.comingDates)}</p> <p>{t(strings.comingDates)}</p>
<ul className="ps-hakken-dates--list"> <ul className="ps-hakken-dates--list">
{dates.map(date => { {dates.map((date, i) => {
const { start, end } = getStartAndEnd(date); const { start, end } = getStartAndEnd(date);
const showStartMonth = start.getMonth() !== end.getMonth(); const showStartMonth = start.getMonth() !== end.getMonth();
const untilString = [ const untilString = [
@ -69,37 +67,16 @@ export default ({ data, lang, className }) => {
t(strings.months[end.getMonth()]), t(strings.months[end.getMonth()]),
].filter(n => n !== null).join(' '); ].filter(n => n !== null).join(' ');
const extraSchedule = date.extraSchedule || []; return <li key={i} className="ps-hakken-dates--item">
const schedule = [
...data.baseSchedule.filter(bs => !extraSchedule.find(es => bs.id === es.id)),
...extraSchedule,
].sort((a, b) => {
const dayDiff = days[a.day] - days[b.day];
if (dayDiff !== 0) {
return dayDiff;
};
return a.time.localeCompare(b.time);
});
return <li className="ps-hakken-dates--item">
<h3>{date.name} [{date.theme}]</h3> <h3>{date.name} [{date.theme}]</h3>
<div dangerouslySetInnerHTML={{ __html: md(t(date.description)) }}></div> <div className="ps-hakken-dates--meta">
<p class="ps-hakken-dates--meta"> <p className="ps-hakken-dates--times">{t(strings.when)}: {untilString}.</p>
<span className="ps-hakken-dates--times">{t(strings.when)}: {untilString}.</span> <p className="ps-hakken-dates--location">
<span className="ps-hakken-dates--location">
{t(strings.where)}:{' '} {t(strings.where)}:{' '}
<span dangerouslySetInnerHTML={{ __html: mdi(t(date.location))}}></span> <span dangerouslySetInnerHTML={{ __html: mdi(t(date.location))}}></span>
</span> </p>
</p> </div>
<details className="ps-hakken-dates--schedule"> <div dangerouslySetInnerHTML={{ __html: md(t(date.description)) }}></div>
<summary>{t(strings.schedule)}</summary>
{schedule.map(entry => <div className="ps-hakken-dates--schedule-entry">
<h5>{t(strings[entry.day])}{' '}{entry.time}</h5>
<div dangerouslySetInnerHTML={{ __html: md(t(entry.title)) }}></div>
</div>)}
</details>
</li>; </li>;
})} })}
</ul> </ul>

View file

@ -12,28 +12,11 @@
padding-left: 1rem; padding-left: 1rem;
} }
&--meta {
font-weight: bold;
}
&--times { &--times {
margin-right: 1rem; margin-bottom: 0;
} }
&--schedule { &--location {
summary { margin-top: 0;
margin-bottom: 0.5rem;
}
}
&--schedule-entry {
display: flex;
align-items: center;
> * {
margin: 0;
margin-left: 0.5rem;
font-size: 1.4rem;
}
} }
} }