diff --git a/README.md b/README.md index b01e3fd..4d03b94 100644 --- a/README.md +++ b/README.md @@ -11,3 +11,31 @@ docker run -it --rm --name hackertours -p 8888:80 hackertours ``` Then open http://localhost:8888 + +## Event cards + +The localized homepages use the `event-cards` shortcode and their `events` front +matter. Cards display in two columns from 666px and in a single column on mobile. +The list covers all host cities, including Easterhegg in Koblenz and Regensburg. +Event logos are SVGs or PNGs in `assets/img/events`, rendered as masks +in the heading color. Set `logoOriginal: true` to display original colors +instead (used by EH20): + +- [37C3](https://designs.events.ccc.de/37C3/37c3-logo-full-black.svg), + [38C3](https://designs.events.ccc.de/38C3/logo-simple.svg), and + [39C3](https://designs.events.ccc.de/39C3/39C3-Logo-RGB_muted-black.svg) + are from the [CCC design archive](https://designs.events.ccc.de/). +- [EH21](https://designs.events.ccc.de/EH21/EH21-Logo.svg) is also from the archive. +- EH20 uses the supplied `EH20-Logo.png`, unchanged. +- EH23 uses the supplied `EH23-Logo (1).svg` wordmark and symbol, with its + background removed and artwork changed to white. Other logos are unmodified. +- [40C3](https://events.ccc.de/congress/2026/infos/assets/favicon.svg) is the + official info-page symbol; the archive has no 40C3 entry yet. +- [EH22](https://git.hamburg.ccc.de/EH22/design-public/src/branch/main/logo/logo_simple.svg) + is the original vector logo by kritzl, traumweh & Schrottkatze, + [CC BY-SA 4.0](https://creativecommons.org/licenses/by-sa/4.0/). + The archive's raster logo includes a glow unsuitable for masking. + +Designer credits from the archive and the EH22 license appear beside the copyright +in the homepage footer only, in both languages. Missing archive credits (40C3, +EH21, EH20) are explicitly marked as unlisted. diff --git a/assets/img/events/37c3.svg b/assets/img/events/37c3.svg new file mode 100644 index 0000000..926f429 --- /dev/null +++ b/assets/img/events/37c3.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/assets/img/events/38c3.svg b/assets/img/events/38c3.svg new file mode 100644 index 0000000..505dbeb --- /dev/null +++ b/assets/img/events/38c3.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/img/events/39c3.svg b/assets/img/events/39c3.svg new file mode 100644 index 0000000..19fddb9 --- /dev/null +++ b/assets/img/events/39c3.svg @@ -0,0 +1,4 @@ + + \ No newline at end of file diff --git a/assets/img/events/40c3.svg b/assets/img/events/40c3.svg new file mode 100644 index 0000000..9146ede --- /dev/null +++ b/assets/img/events/40c3.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/assets/img/events/eh20.png b/assets/img/events/eh20.png new file mode 100644 index 0000000..17a5a04 Binary files /dev/null and b/assets/img/events/eh20.png differ diff --git a/assets/img/events/eh21.svg b/assets/img/events/eh21.svg new file mode 100644 index 0000000..ad75efb --- /dev/null +++ b/assets/img/events/eh21.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/assets/img/events/eh22.svg b/assets/img/events/eh22.svg new file mode 100644 index 0000000..0ab3f5d --- /dev/null +++ b/assets/img/events/eh22.svg @@ -0,0 +1,34 @@ + + + + + + + + + + diff --git a/assets/img/events/eh23.svg b/assets/img/events/eh23.svg new file mode 100644 index 0000000..1fba8a7 --- /dev/null +++ b/assets/img/events/eh23.svg @@ -0,0 +1,10 @@ + + + + + + + + + + \ No newline at end of file diff --git a/assets/sass/_custom.scss b/assets/sass/_custom.scss index 344d5ca..1a83958 100644 --- a/assets/sass/_custom.scss +++ b/assets/sass/_custom.scss @@ -24,8 +24,95 @@ th, td { padding: 3px 6px; font-variant-numeric: tabular-nums; } +.event-cards { + --event-card-border: rgb(0 0 0 / 15%); + --event-card-upcoming-bg: #eee; + --event-card-upcoming-text: #595959; + display: grid; + grid-template-columns: minmax(0, 1fr); + gap: var(--spacing-m); + margin-block: var(--spacing-m); +} +@media (min-width: 666px) { + .event-cards { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } +} +.event-card { + min-width: 0; + overflow: hidden; + border: 1px solid var(--event-card-border); + border-radius: 0.25rem; +} +.event-card--upcoming { + background: var(--event-card-upcoming-bg); + color: var(--event-card-upcoming-text); +} +.event-card--upcoming h3 { + color: inherit; +} +.event-card__header { + display: flex; + align-items: center; + justify-content: space-between; + gap: 1rem; + padding: var(--spacing-xs) 1rem; + border-bottom: 1px solid var(--event-card-border); + color: var(--color-headings); +} +.event-card__logo, +.event-card__image { + flex-shrink: 0; + width: 10rem; + max-width: 60%; + height: 2rem; +} +.event-card__image { + object-fit: contain; + object-position: right center; +} +.event-card__logo { + background-color: currentcolor; + mask: var(--event-logo) right center / contain no-repeat; +} +.event-card__header h2, +.event-card__body h3 { + margin: 0; +} +.event-card__body { + padding: var(--spacing-xs) 1rem; +} +.event-card__body p { + margin-block: var(--spacing-xs); +} +.event-card__body .event-card__date { + margin-bottom: 0; +} +.event-card__body .event-card__status { + margin-block: 0.5em 0; + padding: 0.1rem 0.5rem; + border: 1px solid currentcolor; + border-radius: 0.25rem; + font-size: var(--fs-xs); + font-weight: bold; + letter-spacing: 0.03em; + text-align: center; + text-transform: uppercase; +} +.event-logo-credits { + font-size: var(--fs-xs); +} +.event-logo-credits ul { + padding: 0; + list-style: none; +} @media (prefers-color-scheme: dark) { + .event-cards { + --event-card-border: rgb(255 255 255 / 15%); + --event-card-upcoming-bg: #363636; + --event-card-upcoming-text: #a6a6a6; + } :root { --color-backdrop: #141414; --color-headings: #faf5f5; diff --git a/content/de/_index.md b/content/de/_index.md index bbf4538..2e1354f 100644 --- a/content/de/_index.md +++ b/content/de/_index.md @@ -7,38 +7,65 @@ params: Bei verschiedenen Chaos-Veranstaltungen organisiert der lokale Erfa/Chaostreff Touren zu interessanten Orten in der Stadt und Umgebung. Hier findet ihr Informationen zu aktuellen und früheren Veranstaltungen! logowidth: 220 logoheight: 220 +eventsTitle: Veranstaltungen +events: + - code: 40C3 + title: Model Citizens + event: 40. Chaos Communication Congress + date: 27.–30. Dezember 2026 + location: Hamburg Messe + url: https://events.ccc.de/congress/2026/ + status: In Vorbereitung + - code: EH23 + title: The Bunny is a Lie + event: Easterhegg 2026 + date: 3.–6. April 2026 + location: Universität Koblenz + url: https://eh23.easterhegg.eu/hackertours + - code: 39C3 + title: Power Cycles + event: 39. Chaos Communication Congress + date: 27.–30. Dezember 2025 + location: CCH + url: https://events.ccc.de/congress/2025/ + - code: EH22 + title: Unhandled Eggception + event: Easterhegg 2025 + date: 18.–21. April 2025 + location: Kampnagel + url: https://eh22.easterhegg.eu/ + - code: 38C3 + title: Illegal Instructions + event: 38. Chaos Communication Congress + date: 27.–30. Dezember 2024 + location: CCH + url: https://events.ccc.de/congress/2024/ + - code: EH21 + title: RABBIT PROTOTYPING + event: Easterhegg 2024 + date: 29. März–1. April 2024 + location: OTH Regensburg + url: https://eh21.easterhegg.eu/hackertours + - code: 37C3 + title: Unlocked + event: 37. Chaos Communication Congress + date: 27.–30. Dezember 2023 + location: CCH + url: https://events.ccc.de/congress/2023/ + - code: EH20 + logoOriginal: true + title: Back to root + event: Easterhegg 2023 + date: 7.–10. April 2023 + location: Kampnagel, Hamburg + url: https://eh20.easterhegg.eu/hackertours.html cascade: params: intro: Euer Anbieter für Sightseeing für Technik-Enthusiasten! --- -# Aktuelle Events +{{< event-cards >}} -* 40C3 Hackertours: In Planung... - -# Frühere Events - -## 2026 - -* [Easteregg 2026 Hackertours](https://eh23.easterhegg.eu/hackertours) - -## 2025 - -* [Easterhegg 2025 Hackertours](https://hackertours.hamburg.ccc.de/en/eh22/) -* [39C3 Hackertours](https://hackertours.hamburg.ccc.de/en/39c3/) - - -## 2024 - -* [38C3 Hackertours](https://hackertours.hamburg.ccc.de/de/38c3/) -* [Easterhegg 2024 Hackertours](https://eh21.easterhegg.eu/hackertours) - -## 2023 - -* [37C3 Hackertours](https://hackertours.hamburg.ccc.de/de/37c3/) -* [Easterhegg 2023 Hackertours](https://eh20.easterhegg.eu/hackertours.html) - - -Folgt uns unter @hackertours@chaos.social! +Folgt uns unter [@hackertours@chaos.social](https://chaos.social/@hackertours)! # News diff --git a/content/en/_index.md b/content/en/_index.md index 768e2ed..2e5811f 100644 --- a/content/en/_index.md +++ b/content/en/_index.md @@ -7,39 +7,66 @@ params: At various Chaos events the local club organizes tours to interesting places in the city and surroundings. Here you will find infos about current and past events! logowidth: 220 logoheight: 220 +eventsTitle: Events +events: + - code: 40C3 + title: Model Citizens + event: 40th Chaos Communication Congress + date: 27–30 December 2026 + location: Hamburg Messe + url: https://events.ccc.de/congress/2026/ + status: In preparation + - code: EH23 + title: The Bunny is a Lie + event: Easterhegg 2026 + date: 3–6 April 2026 + location: University of Koblenz + url: https://eh23.easterhegg.eu/hackertours + - code: 39C3 + title: Power Cycles + event: 39th Chaos Communication Congress + date: 27–30 December 2025 + location: CCH + url: https://events.ccc.de/congress/2025/ + - code: EH22 + title: Unhandled Eggception + event: Easterhegg 2025 + date: 18–21 April 2025 + location: Kampnagel + url: https://eh22.easterhegg.eu/ + - code: 38C3 + title: Illegal Instructions + event: 38th Chaos Communication Congress + date: 27–30 December 2024 + location: CCH + url: https://events.ccc.de/congress/2024/ + - code: EH21 + title: RABBIT PROTOTYPING + event: Easterhegg 2024 + date: 29 March–1 April 2024 + location: OTH Regensburg + url: https://eh21.easterhegg.eu/hackertours + - code: 37C3 + title: Unlocked + event: 37th Chaos Communication Congress + date: 27–30 December 2023 + location: CCH + url: https://events.ccc.de/congress/2023/ + - code: EH20 + logoOriginal: true + title: Back to root + event: Easterhegg 2023 + date: 7–10 April 2023 + location: Kampnagel, Hamburg + url: https://eh20.easterhegg.eu/hackertours.html cascade: params: intro: Your provider of sightseeing tours for technical enthusiasts! --- -# Current Events +{{< event-cards >}} -* 40C3 Hackertours: Planning... - -# Previous Events - -## 2026 - -* [Easteregg 2026 Hackertours](https://eh23.easterhegg.eu/hackertours) - -## 2025 - -* [Easterhegg 2025 Hackertours](https://hackertours.hamburg.ccc.de/en/eh22/) -* [39C3 Hackertours](https://hackertours.hamburg.ccc.de/en/39c3/) - - -## 2024 - -* [38C3 Hackertours](https://hackertours.hamburg.ccc.de/en/38c3/) -* [Easterhegg 2024 Hackertours](https://eh21.easterhegg.eu/hackertours) - -## 2023 - -* [37C3 Hackertours](https://hackertours.hamburg.ccc.de/en/37c3/) -* [Easterhegg 2023 Hackertours](https://eh20.easterhegg.eu/hackertours.html) - - -Follow us at @hackertours@chaos.social! +Follow us at [@hackertours@chaos.social](https://chaos.social/@hackertours)! # News diff --git a/i18n/de.toml b/i18n/de.toml new file mode 100644 index 0000000..8871665 --- /dev/null +++ b/i18n/de.toml @@ -0,0 +1,11 @@ +[event_logo_credits] +other = "Credits der Veranstaltungslogos" + +[event_logo_designer_unlisted] +other = "Design im Archiv nicht angegeben" + +[event_logo_modified] +other = "Hintergrund entfernt und Grafik weiß eingefärbt" + +[event_logo_source] +other = "Original" diff --git a/i18n/en.toml b/i18n/en.toml new file mode 100644 index 0000000..3341117 --- /dev/null +++ b/i18n/en.toml @@ -0,0 +1,11 @@ +[event_logo_credits] +other = "Event logo credits" + +[event_logo_designer_unlisted] +other = "Designer not listed in the archive" + +[event_logo_modified] +other = "background removed and artwork recolored white" + +[event_logo_source] +other = "Original" diff --git a/layouts/_partials/footer.html b/layouts/_partials/footer.html new file mode 100644 index 0000000..34fdcdc --- /dev/null +++ b/layouts/_partials/footer.html @@ -0,0 +1,18 @@ +{{ if $.Param "feedlinks" }}{{ partial "feedlinks.html" . }}{{ end -}} +

{{ with site.Copyright }}{{ . | site.Home.RenderString }}{{ else }}© {{ site.Title }}{{ end }}

+{{ if .IsHome }} +
+

{{ i18n "event_logo_credits" }} (CCC Design Archive):

+ +
+{{ end }} +{{ with $.Param "footer" }}

{{ . | site.Home.RenderString }}

{{ end }} +{{ if $.Param "poweredby" }}

Powered by Hugo and the Zen theme.

{{ end }} diff --git a/layouts/shortcodes/event-cards.html b/layouts/shortcodes/event-cards.html new file mode 100644 index 0000000..da70fb6 --- /dev/null +++ b/layouts/shortcodes/event-cards.html @@ -0,0 +1,29 @@ +
+

{{ .Page.Params.eventsTitle }}

+
+ {{ range .Page.Params.events }} +
+
+

{{ .code }}

+ {{ $logo := resources.GetMatch (printf "img/events/%s.*" (lower .code)) }} + {{ $original := .logoOriginal }} + {{ with $logo }} + {{ if $original }} + + {{ else }} + + {{ end }} + {{ else }} + {{ errorf "Missing event logo for %s" .code }} + {{ end }} +
+
+

{{ if .status }}{{ .title }}{{ else }}{{ .title }}{{ end }}

+

{{ .event }}

+

{{ .date }}, {{ .location }}

+ {{ with .status }}

{{ . }}

{{ end }} +
+
+ {{ end }} +
+