adjust styling and bump dates etc

README.md

@@ -30,21 +30,20 @@ This is the website of the CCCB.
 Every change you make on the project will be reflected in your browser as long
 as `hugo serve` is running.
 
-The *"Nächste Veranstaltungen"* table on the home page is generated by
+The *"Nächste Veranstaltungen"* calendar on the home page is rendered by
-post-processing in `./build.sh`, not by Hugo, so it is **not** visible under
+Hugo via the `calendar` shortcode, which fetches `all.ics` client-side.
-`hugo serve`. To preview the fully-built site (including the home-page
+`all.ics` is generated from the individual event pages by `./tools/merge_cals.py`.
-calendar), or to ready the site for upload, run:
+To preview the fully-built site (including `all.ics`), or to ready the site for
+upload, run:
 
 ```shell
 ./build.sh
 python3 -m http.server -d public 1313
 ```
 
-`build.sh` generates `all.ics` and replaces the `CALENDAR` placeholder in
+`build.sh` runs `hugo`, generates `all.ics`, and copies it into `public/`.
-`index.html` with the upcoming-events table. It depends on Python with the
+It depends on Python with the `icalendar`, `python-dateutil`, and `pytz`
-`icalendar`, `python-dateutil`, and `pytz` packages, plus a `de_DE.UTF-8`
+packages. Inside `nix develop` these are provided automatically.
-locale (used to format weekday names). Inside `nix develop` these are
-provided automatically.
 
 To build with *nix*: `nix build '.?submodules=1#production-content'`
 

archetypes/datengarten.md

@@ -11,10 +11,10 @@ speaker:
 #speaker_url:
 date: {{ .Date }}
 event:
-  - start: {{ .Date }}
+  start: {{ .Date }}
-  - end:   {{ .Date }}
+  end:   {{ .Date }}
 location: CCCB
-language: Englisch
+language: de
 streaming: true
 #recording: https://media.ccc.de/v/dg-{{ .File.TranslationBaseName }}
 ---

assets/css/calendar.css

@@ -36,15 +36,12 @@
     border-collapse: collapse;
   }
   #calendar-table th, #calendar-table td {
-    border: 1px;
+    border: none;
     padding: 5px;
     text-align: center;
     vertical-align: top;
     height: 50px;
     width: 15%;
-  }
-  #calendar-table th
-  #calendar-table td {
     position: relative;
     cursor: pointer;
   }
@@ -83,8 +80,6 @@
     background-color: rgba(255, 255, 255, 0.1);
     box-shadow: 0 0 20px rgba(255, 255, 255, 0.1);
     border-radius: 8px;
-    width: 20px;
-    height: 20px;
     border: 5px solid grey;
     font-weight: lighter;
     position: relative;

assets/css/custom.css

@@ -0,0 +1,411 @@
+/* ── Self-hosted fonts ──────────────────────────────────────────────────── */
+
+@font-face {
+  font-family: 'Press Start 2P';
+  src: url('/fonts/PressStart2P.woff2') format('woff2');
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap;
+}
+
+/* ── Modern micro-improvements ─────────────────────────────────────────── */
+
+/* Smooth scrolling */
+html {
+  scroll-behavior: smooth;
+}
+
+/* Thin, modern scrollbar on WebKit */
+::-webkit-scrollbar { width: 6px; height: 6px; }
+::-webkit-scrollbar-track { background: transparent; }
+::-webkit-scrollbar-thumb {
+  background: rgba(var(--color-neutral-500), 0.5);
+  border-radius: 3px;
+}
+::-webkit-scrollbar-thumb:hover {
+  background: rgba(var(--color-primary-400), 0.7);
+}
+
+/* ── Typography ─────────────────────────────────────────────────────────── */
+
+/* Tighter, more confident headings */
+h1, h2, h3 {
+  letter-spacing: -0.02em;
+}
+
+/* Slightly warmer body text contrast in dark mode */
+.dark .prose {
+  color: rgba(var(--color-neutral-200), 0.92);
+}
+
+/* ── Cards ──────────────────────────────────────────────────────────────── */
+
+/* Lift + glow on card hover */
+article.cursor-pointer,
+.cursor-pointer[class*="backdrop"] {
+  transition: transform 0.2s ease, box-shadow 0.2s ease;
+}
+article.cursor-pointer:hover,
+.cursor-pointer[class*="backdrop"]:hover {
+  transform: translateY(-3px);
+  box-shadow: 0 12px 32px rgba(var(--color-primary-400), 0.12);
+}
+
+/* ── Links ──────────────────────────────────────────────────────────────── */
+
+/* Animated underline: grows from left on hover */
+.prose a:not([class]) {
+  text-decoration: none;
+  background-image: linear-gradient(
+    rgba(var(--color-primary-400), 0.9),
+    rgba(var(--color-primary-400), 0.9)
+  );
+  background-size: 0 1.5px;
+  background-position: 0 100%;
+  background-repeat: no-repeat;
+  transition: background-size 0.2s ease;
+}
+.prose a:not([class]):hover {
+  background-size: 100% 1.5px;
+}
+
+/* ── Header ─────────────────────────────────────────────────────────────── */
+
+/* Crisper blur on the fixed-fill-blur header */
+#menu-blur {
+  backdrop-filter: blur(20px) saturate(180%);
+  -webkit-backdrop-filter: blur(20px) saturate(180%);
+  background: rgba(var(--color-neutral-50), 0.85) !important;
+}
+.dark #menu-blur {
+  background: rgba(var(--color-neutral-900), 0.72) !important;
+}
+
+/* ── Hero / Background ──────────────────────────────────────────────────── */
+
+/* Subtle gradient vignette over hero images */
+.single_hero_background::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+  background: linear-gradient(
+    to bottom,
+    transparent 40%,
+    rgba(var(--color-neutral-200), 0.5) 100%
+  );
+  pointer-events: none;
+}
+.dark .single_hero_background::after {
+  background: linear-gradient(
+    to bottom,
+    transparent 40%,
+    rgba(var(--color-neutral-900), 0.6) 100%
+  );
+}
+
+/* ── Focus rings ────────────────────────────────────────────────────────── */
+
+/* Modern, rounded focus ring */
+:focus-visible {
+  outline: 2px solid rgba(var(--color-primary-400), 0.9);
+  outline-offset: 3px;
+  border-radius: 4px;
+}
+
+/* ── Buttons / Tags ─────────────────────────────────────────────────────── */
+
+/* Pill-shaped tags with subtle glow on hover */
+a[href*="/tags/"],
+a[href*="/categories/"] {
+  border-radius: 9999px;
+  transition: box-shadow 0.2s ease, background 0.2s ease;
+}
+a[href*="/tags/"]:hover,
+a[href*="/categories/"]:hover {
+  box-shadow: 0 0 0 3px rgba(var(--color-primary-400), 0.2);
+}
+
+/* ── Code blocks ────────────────────────────────────────────────────────── */
+
+/* Rounded corners and a border on code blocks */
+.dark .highlight {
+  border: 1px solid rgba(var(--color-neutral-700), 1);
+  border-radius: 8px;
+  overflow: hidden;
+}
+
+/* ── Retro-terminal layer ───────────────────────────────────────────────── */
+
+/* Monospace headings + neon glow in dark mode */
+.dark .prose h1,
+.dark .prose h2,
+.dark .prose h3 {
+  font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace;
+  text-shadow:
+    0 0 8px  rgba(var(--color-primary-400), 0.55),
+    0 0 28px rgba(var(--color-primary-400), 0.2),
+    0 0 2px  rgba(192, 132, 252, 0.35);
+  letter-spacing: 0;
+}
+
+/* Scanline texture (dark mode only) */
+.dark body::after {
+  content: "";
+  position: fixed;
+  inset: 0;
+  z-index: 9998;
+  pointer-events: none;
+  background: repeating-linear-gradient(
+    0deg,
+    rgba(0, 0, 0, 0.04) 0px,
+    rgba(0, 0, 0, 0.04) 1px,
+    transparent 1px,
+    transparent 4px
+  );
+}
+
+/* Terminal window chrome on code blocks (traffic-light dots via radial gradients) */
+.dark .highlight::before {
+  content: "";
+  display: block;
+  height: 28px;
+  background-color: rgba(var(--color-neutral-800), 1);
+  background-image:
+    radial-gradient(circle 5px at 16px 14px, #ff5f56 0%, #ff5f56 100%),
+    radial-gradient(circle 5px at 32px 14px, #ffbd2e 0%, #ffbd2e 100%),
+    radial-gradient(circle 5px at 48px 14px, #27c93f 0%, #27c93f 100%);
+  background-repeat: no-repeat;
+  border-bottom: 1px solid rgba(var(--color-neutral-700), 0.8);
+}
+
+/* Phosphor glow on hovered prose links in dark mode */
+.dark .prose a:not([class]):hover {
+  text-shadow: 0 0 8px rgba(var(--color-primary-400), 0.4);
+}
+
+/* Cyan glow on card hover in dark mode */
+.dark article.cursor-pointer:hover,
+.dark .cursor-pointer[class*="backdrop"]:hover {
+  box-shadow: 0 12px 40px rgba(var(--color-primary-400), 0.18),
+              0 0 0 1px rgba(var(--color-primary-400), 0.1);
+}
+
+/* Slide-in "> " prompt before nav items on hover (dark mode) */
+.dark .main-menu a p::before {
+  content: "> ";
+  display: inline-block;
+  max-width: 0;
+  overflow: hidden;
+  color: rgba(var(--color-primary-400), 0.65);
+  font-family: ui-monospace, monospace;
+  font-weight: normal;
+  transition: max-width 0.15s ease;
+  vertical-align: bottom;
+}
+.dark .main-menu a:hover p::before {
+  max-width: 1.5em;
+}
+
+/* Blinking block cursor keyframe (reusable) */
+@keyframes cursor-blink {
+  0%, 100% { opacity: 1; }
+  50%       { opacity: 0; }
+}
+
+/* ── Pixel font — site title ────────────────────────────────────────────── */
+
+/* Navbar site title — only the first nav (space-x-3) holds the site title link;
+   the menu items live in the second nav (hidden md:flex) */
+.main-menu .flex-1 nav:first-of-type a {
+  font-family: 'Press Start 2P', ui-monospace, monospace !important;
+  font-size: 0.6rem !important;
+  transform: scaleY(1.4);
+  display: inline-block;
+  letter-spacing: 0 !important;
+  transition: color 0.2s ease, text-shadow 0.2s ease;
+}
+
+/* Homepage hero h1 (font-extrabold is set only on the background layout h1) */
+h1.font-extrabold {
+  font-family: 'Press Start 2P', ui-monospace, monospace !important;
+  letter-spacing: 0 !important;
+  transition: color 0.2s ease, text-shadow 0.2s ease;
+}
+
+/* Scale down the homepage h1 — pixel fonts read best smaller */
+h1.font-extrabold {
+  font-size: clamp(1rem, 2.5vw, 1.6rem) !important;
+  line-height: 1.8 !important;
+}
+
+/* Purple glow on hover — navbar */
+.main-menu .flex-1 nav:first-of-type a:hover {
+  color: #c084fc !important;
+  text-shadow:
+    0 0 6px rgba(192, 132, 252, 0.9),
+    0 0 18px rgba(168, 85, 247, 0.6),
+    0 0 40px rgba(139, 92, 246, 0.3);
+}
+
+/* Purple glow on hover — homepage h1 */
+h1.font-extrabold:hover {
+  color: #c084fc !important;
+  text-shadow:
+    0 0 8px rgba(192, 132, 252, 0.9),
+    0 0 24px rgba(168, 85, 247, 0.6),
+    0 0 50px rgba(139, 92, 246, 0.3);
+  cursor: default;
+}
+
+/* ── Cyberpunk layer ─────────────────────────────────────────────────────── */
+
+/* Text selection — neon cyan highlight */
+.dark ::selection {
+  background: rgba(34, 211, 238, 0.2);
+  color: rgba(var(--color-neutral-50), 1);
+}
+
+/* Cyberpunk background: ambient glows + drifting grid (dark mode) */
+@keyframes grid-drift {
+  from { background-position: 0 0, 0 0, 0 0, 0 0; }
+  to   { background-position: 0 0, 0 0, 48px 48px, 48px 48px; }
+}
+
+.dark body::before {
+  content: "";
+  position: fixed;
+  inset: 0;
+  z-index: 0;
+  pointer-events: none;
+  background-image:
+    radial-gradient(ellipse 55vw 55vh at 88% 4%,  rgba(34, 211, 238, 0.07),  transparent),
+    radial-gradient(ellipse 45vw 45vh at  8% 96%, rgba(192, 132, 252, 0.06), transparent),
+    linear-gradient(rgba(34, 211, 238, 0.018) 1px, transparent 1px),
+    linear-gradient(90deg, rgba(34, 211, 238, 0.018) 1px, transparent 1px);
+  background-size: 100% 100%, 100% 100%, 48px 48px, 48px 48px;
+  animation: grid-drift 28s linear infinite;
+}
+
+/* Neon horizontal rule — cyan-to-magenta gradient */
+.dark .prose hr {
+  border: none;
+  height: 1px;
+  background: linear-gradient(
+    90deg,
+    transparent,
+    rgba(34, 211, 238, 0.6) 20%,
+    rgba(192, 132, 252, 0.6) 50%,
+    rgba(34, 211, 238, 0.6) 80%,
+    transparent
+  );
+  box-shadow: 0 0 10px rgba(34, 211, 238, 0.25);
+  margin: 2em 0;
+}
+
+/* Glitch keyframes for site title */
+@keyframes neon-glitch {
+  0%, 88%, 100% { text-shadow: inherit; }
+  89% {
+    text-shadow:
+      -2px 0 rgba(255, 0, 128, 0.85),
+       2px 0 rgba(34, 211, 238, 0.85);
+  }
+  91% {
+    text-shadow:
+       2px 0 rgba(255, 0, 128, 0.85),
+      -2px 0 rgba(34, 211, 238, 0.85);
+  }
+  93% { text-shadow: inherit; }
+  94% {
+    text-shadow:
+      -1px 0 rgba(255, 0, 128, 0.6),
+       1px 0 rgba(34, 211, 238, 0.6);
+  }
+  96% { text-shadow: inherit; }
+}
+
+/* Apply glitch to pixel-font site title in dark mode */
+.dark .main-menu .flex-1 nav:first-of-type a {
+  animation: neon-glitch 9s infinite;
+}
+
+/* Neon card border glow — enhanced dual-color on hover */
+.dark article.cursor-pointer:hover,
+.dark .cursor-pointer[class*="backdrop"]:hover {
+  box-shadow:
+    0 12px 40px rgba(34, 211, 238, 0.22),
+    0  0   0  1px rgba(34, 211, 238, 0.18),
+    0  0  20px rgba(192, 132, 252, 0.08) inset;
+}
+
+/* Neon code-block border */
+.dark .highlight {
+  border-color: rgba(34, 211, 238, 0.3);
+  box-shadow: 0 0 14px rgba(34, 211, 238, 0.07);
+}
+
+/* ── Fairydust rocket ───────────────────────────────────────────────────── */
+
+.fairydust-wrapper {
+  position: fixed;
+  z-index: 9997;
+  pointer-events: none;
+  width: 40px;
+  overflow: visible;
+}
+
+.fairydust-wrapper.go-right {
+  left: -100px;
+  animation: fairydust-fly-right var(--fly-duration, 5s) linear forwards;
+}
+.fairydust-wrapper.go-left {
+  right: -100px;
+  animation: fairydust-fly-left var(--fly-duration, 5s) linear forwards;
+}
+
+/* Comet trail */
+.fairydust-wrapper::after {
+  content: "";
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 130px;
+  height: 6px;
+  border-radius: 3px;
+}
+.fairydust-wrapper.go-right::after {
+  right: 100%;
+  background: linear-gradient(to right, transparent, rgba(232, 121, 249, 0.5));
+}
+.fairydust-wrapper.go-left::after {
+  left: 100%;
+  background: linear-gradient(to left, transparent, rgba(232, 121, 249, 0.5));
+}
+
+.fairydust-rocket {
+  width: 40px;
+  height: 80px;
+  animation: fairydust-glow 0.85s ease-in-out infinite alternate;
+}
+
+@keyframes fairydust-glow {
+  from {
+    filter:
+      drop-shadow(0 0 5px  rgba(232, 121, 249, 0.8))
+      drop-shadow(0 0 14px rgba(232, 121, 249, 0.4));
+  }
+  to {
+    filter:
+      drop-shadow(0 0 10px rgba(232, 121, 249, 1))
+      drop-shadow(0 0 26px rgba(168,  85, 247, 0.65));
+  }
+}
+
+@keyframes fairydust-fly-right {
+  from { left: -100px; }
+  to   { left: calc(100vw + 100px); }
+}
+@keyframes fairydust-fly-left {
+  from { right: -100px; }
+  to   { right: calc(100vw + 100px); }
+}

assets/css/schemes/fira.css

@@ -0,0 +1,37 @@
+/* Fira scheme — deep navy + cyan + emerald */
+:root {
+  --color-neutral: 255, 255, 255;
+  /* Deep cool-slate — richer than pure black in dark mode */
+  --color-neutral-50:  247, 250, 252;
+  --color-neutral-100: 234, 241, 248;
+  --color-neutral-200: 210, 225, 238;
+  --color-neutral-300: 168, 196, 218;
+  --color-neutral-400: 120, 148, 178;
+  --color-neutral-500:  80, 105, 135;
+  --color-neutral-600:  50,  70, 100;
+  --color-neutral-700:  32,  48,  70;
+  --color-neutral-800:  20,  30,  48;
+  --color-neutral-900:  10,  15,  25;
+  /* Cyan — electric, technical */
+  --color-primary-50:  236, 254, 255;
+  --color-primary-100: 207, 250, 254;
+  --color-primary-200: 165, 243, 252;
+  --color-primary-300: 103, 232, 249;
+  --color-primary-400:  34, 211, 238;
+  --color-primary-500:   6, 182, 212;
+  --color-primary-600:   8, 145, 178;
+  --color-primary-700:  14, 116, 144;
+  --color-primary-800:  21,  94, 117;
+  --color-primary-900:  22,  78,  99;
+  /* Emerald — nod to CCC's green */
+  --color-secondary-50:  240, 253, 244;
+  --color-secondary-100: 220, 252, 231;
+  --color-secondary-200: 187, 247, 208;
+  --color-secondary-300: 134, 239, 172;
+  --color-secondary-400:  74, 222, 128;
+  --color-secondary-500:  34, 197,  94;
+  --color-secondary-600:  22, 163,  74;
+  --color-secondary-700:  21, 128,  61;
+  --color-secondary-800:  22, 101,  52;
+  --color-secondary-900:  20,  83,  45;
+}

assets/js/calendar.js

@@ -35,6 +35,8 @@ document.addEventListener('DOMContentLoaded', function() {
                             event.description = value;
                         } else if (baseKey === "RRULE") {
                             event.rrule = value;
+                        } else if (baseKey === "URL") {
+                            event.url = value;
                         }
                     }
                 }
@@ -281,13 +283,11 @@ document.addEventListener('DOMContentLoaded', function() {
                     const events = eventsByDate[dateKey];
                     const hasMembersOnly = events.some(e => e.summary.toLowerCase().includes("members only"));
                     const hasSubbotnik = events.some(e => e.summary.toLowerCase().includes("subbotnik"));
-                    const hasBastelabend = events.some(e => e.summary.toLowerCase().includes("bastelabend"));
                     const hasSpieleabend = events.some(e => e.summary.toLowerCase().includes("spieleabend"));
                     const hasRegular = events.some(e => {
                         const title = e.summary.toLowerCase();
                         return !title.includes("members only") && 
                               !title.includes("subbotnik") && 
-                              !title.includes("bastelabend") && 
                               !title.includes("spieleabend");
                     });
                     
@@ -297,7 +297,7 @@ document.addEventListener('DOMContentLoaded', function() {
                         dot.className = "event-dot event-dot-red";
                         dotsContainer.appendChild(dot);
                     }
-                    if (hasSubbotnik || hasBastelabend || hasSpieleabend) {
+                    if (hasSubbotnik || hasSpieleabend) {
                         let dot = document.createElement("div");
                         dot.className = "event-dot event-dot-orange";
                         dotsContainer.appendChild(dot);
@@ -329,20 +329,6 @@ document.addEventListener('DOMContentLoaded', function() {
             calendarBody.appendChild(row);
         }
 
-        function createEventLink(eventTitle) {
-            if (eventTitle.startsWith("Datengarten")) {
-                // Extract the number after "Datengarten "
-                const match = eventTitle.match(/Datengarten\s+(\d+)/i);
-                if (match && match[1]) {
-                    return `https://berlin.ccc.de/datengarten/${match[1]}/`;
-                }
-            } 
-            
-            // For other titles, convert to lowercase and use as path
-            const slug = eventTitle.toLowerCase().replace(/\s+/g, '-').replace(/[^\w-]/g, '');
-            return `https://berlin.ccc.de/page/${slug}/`;
-        }
-
         function showEventDetails(dateKey) {
             const events = eventsByDate[dateKey];
             eventDateElem.textContent = formatDate(dateKey);
@@ -357,10 +343,16 @@ document.addEventListener('DOMContentLoaded', function() {
                     eventTitle.className = "event-title";
                     
                     // Create a link for the event title
-                    let titleLink = document.createElement("h");
+                    if (ev.url) {
+                        let titleLink = document.createElement("a");
                         titleLink.textContent = ev.summary;
+                        titleLink.href = ev.url;
                         titleLink.target = "_blank";
+                        titleLink.rel = "noopener noreferrer";
                         eventTitle.appendChild(titleLink);
+                    } else {
+                        eventTitle.textContent = ev.summary;
+                    }
                     
                     eventItem.appendChild(eventTitle);
 

assets/js/clubstatus.js

@@ -1,25 +1,21 @@
 const spaceapiUrl = "https://spaceapi.hamburg.ccc.de"
 const interval_ms = 60000
 
-console.log("clubstatus.js geladen!"); /* TODO: ENTFERNEN */
-
 function timeDistanceDE(pastDate) {
   const seconds = Math.floor((Date.now() - pastDate.getTime()) / 1000)
   const minutes = Math.floor(seconds / 60)
   const hours = Math.floor(minutes / 60)
   const days = Math.floor(hours / 24)
 
-  if (days = 1) return `since ${days}d`
+  if (days >= 1) return `seit ${days}d`
-  if (days > 1) return `since ${days}d`
+  if (hours >= 1) return `seit ${hours}h`
-  if (hours = 1) return `since ${hours}h`
+  if (minutes >= 1) return `seit ${minutes}min`
-  if (hours > 1) return `since ${hours}h`
-  if (minutes = 1) return `since ${minutes}min`
-  if (minutes > 1) return `since ${minutes}min`
   return `gerade eben`
 }
 
 function updateRoomState(openState, lastChangeTimestamp) {
   const roomstate = document.querySelector('#clubstatus-badge')
+  if (!roomstate) return
   const statusItem = roomstate.querySelector(".state")
   const durationItem = roomstate.querySelector(".duration")
 
@@ -30,17 +26,20 @@ function updateRoomState(openState, lastChangeTimestamp) {
 
   if (openState === null || lastChangeTimestamp === null) {
     statusItem.textContent = "unbekannt"
+    roomstate.classList.add("unknown")
     statusItem.classList.add("unknown")
-    durationItem.textContent = "(since unbekannt)"
+    durationItem.textContent = "(seit unbekannt)"
   } else {
     const changeDate = new Date(lastChangeTimestamp * 1000)
     const sinceText = timeDistanceDE(changeDate)
 
     if (openState) {
       statusItem.textContent = "open"
+      roomstate.classList.add("open")
       statusItem.classList.add("open")
     } else {
       statusItem.textContent = "closed"
+      roomstate.classList.add("closed")
       statusItem.classList.add("closed")
     }
 

assets/js/fairydust.js

@@ -0,0 +1,62 @@
+(function () {
+  'use strict';
+
+  var SVG = [
+    '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 80" width="40" height="80">',
+    // Exhaust flame
+    '<path d="M13,65 Q20,80 27,65" fill="#f97316" opacity="0.85"/>',
+    '<path d="M15,63 Q20,74 25,63" fill="#fbbf24"/>',
+    // Fins
+    '<path d="M11,53 L3,70 L14,58" fill="#a855f7"/>',
+    '<path d="M29,53 L37,70 L26,58" fill="#a855f7"/>',
+    // Body
+    '<ellipse cx="20" cy="42" rx="11" ry="22" fill="#e879f9"/>',
+    // Nose cone
+    '<path d="M20,10 L10,32 L30,32 Z" fill="#c026d3"/>',
+    // Window
+    '<circle cx="20" cy="44" r="7" fill="#0ea5e9" opacity="0.82"/>',
+    '<circle cx="22" cy="41" r="2.5" fill="white" opacity="0.35"/>',
+    // Body highlight
+    '<ellipse cx="15" cy="36" rx="3" ry="8" fill="white" opacity="0.15" transform="rotate(-15,15,36)"/>',
+    '</svg>'
+  ].join('');
+
+  function isDark() {
+    return document.documentElement.classList.contains('dark');
+  }
+
+  function launch() {
+    if (!isDark()) { scheduleNext(); return; }
+
+    var goRight  = Math.random() > 0.5;
+    var topPct   = 6 + Math.random() * 72;
+    var duration = (3.5 + Math.random() * 4).toFixed(1);
+
+    var wrapper = document.createElement('div');
+    wrapper.className = 'fairydust-wrapper ' + (goRight ? 'go-right' : 'go-left');
+    wrapper.style.top = topPct + 'vh';
+    wrapper.style.setProperty('--fly-duration', duration + 's');
+
+    var rocket = document.createElement('div');
+    rocket.className = 'fairydust-rocket';
+    rocket.style.transform = 'rotate(' + (goRight ? 90 : -90) + 'deg)';
+    rocket.innerHTML = SVG;
+
+    wrapper.appendChild(rocket);
+    document.body.appendChild(wrapper);
+
+    wrapper.addEventListener('animationend', function (e) {
+      if (e.animationName === 'fairydust-fly-right' ||
+          e.animationName === 'fairydust-fly-left') {
+        wrapper.remove();
+      }
+    });
+
+    scheduleNext();
+  }
+
+  function scheduleNext() {
+    setTimeout(launch, 250000 + Math.random() * 950000); // 250–1200 s
+  }
+
+})();

build.sh

@@ -7,6 +7,4 @@ rm -rf public/ # delete old generated files
 
 hugo $(cat .hugo-params)
 ./tools/merge_cals.py
-upcoming="$(tools/gen_upcoming.py static/all.ics 20 5 | tr '\n' ' ')"
 cp static/all.ics public/all.ics
-sed -i "s#CALENDAR#$upcoming#g" public/index.html

config/_default/hugo.toml

@@ -1,7 +1,6 @@
 theme = "blowfish"
 baseURL = "/"
 defaultContentLanguage = "de"
-relativeURLs = true
 canonifyURLs = true
 pluralizeListTitles = false
 enableRobotsTXT = true

config/_default/params.toml

@@ -28,7 +28,7 @@ giteaDefaultServer = "https://git.fsfe.org"
 forgejoDefaultServer = "https://git.berlin.ccc.de"
 
 [header]
-layout = "basic"  # valid options: basic, fixed, fixed-fill, fixed-gradient, fixed-fill-blur
+layout = "fixed-fill-blur"  # valid options: basic, fixed, fixed-fill, fixed-gradient, fixed-fill-blur
 
 [footer]
 showMenu = true
@@ -46,7 +46,7 @@ showMoreLink = true
 showMoreLinkDest = "/post/"
 cardView = true
 cardViewScreenWidth = false
-layoutBackgroundBlur = false  # only used when layout equals background
+layoutBackgroundBlur = true  # only used when layout equals background
 
 [article]
 showDate = true
@@ -85,14 +85,14 @@ showHero = false
 layoutBackgroundBlur = true  # only used when heroStyle equals background or thumbAndBackground
 layoutBackgroundHeaderSpace = true  # only used when heroStyle equals background
 showBreadcrumbs = false
-showSummary = false
+showSummary = true
 showViews = false
 showLikes = false
 showTableOfContents = false
-showCards = false
+showCards = true
 orderByWeight = false
 groupByYear = true
-cardView = false
+cardView = true
 cardViewScreenWidth = false
 constrainItemsWidth = false
 

content/_index.md

@@ -25,6 +25,6 @@ description: "Startseite CCCB mit Kurzkalender"
 
 ### Nächste Veranstaltungen
 
-CALENDAR
+{{< calendar >}}
 
 Weitere Termine findest du im [Veranstaltungskalender](/verein/calendar/).

content/post/Neujahresempfang-2026/index.md

@@ -1,6 +1,6 @@
 ---
 title: "Der Neujahresempfang 2026 #NJE26"
-date: 2026-03-05T12:00:00+01:00
+date: 2026-05-23T12:00:00+01:00
 showHero: false
 tags: ["NJE", "Ankündigung"]
 

content/sonstiges/oma_paulsen_erzählt_von_früher.md

@@ -1,130 +0,0 @@
----
-title: "Oma Paulsen erzählt von früher"
-date: 2018-05-20T23:16:30+02:00
-menu:
-  main:
-    parent: "sonstiges"
-draft: true
----
-
-Rundfunk
---------
-
--   [Bilder zur Geschichte des Rundfunks bis
-    1945](http://www.dra.de/galerie.htm) Bilder DRA
--   [Rundfunkwerbung der dreißiger Jahre von Elly
-    Heuss-Knapp](http://www.dra.de/dok_0504.htm)
--   [Hans Fritsche. Rundfunk im totalen Krieg. (Reichsrundfunk 1944/45,
-    Heft 13, S
-    135ff.)](http://www.mediaculture-online.de/fileadmin/bibliothek/fritzsche_total/fritzsche_total.pdf)
-    (PDF)
--   [Verbot des Niggerjazz. Teil einer auf der Intendantentagung am 12.
-    Oktober 1935 gehaltenen
-    Rede.](http://www.mediaculture-online.de/fileadmin/bibliothek/hadamovsky_jazz/hadamovsky_jazz.pdf)
-    (PDF)
--   [Zensur im Rundfunk. Niederschrift zur Sitzung des Programmrates des
-    deutschen Rundfunks aus dem Jahr
-    1929](http://www.mediaculture-online.de/fileadmin/bibliothek/hardt_zensur/hardt_zensur.pdf)
-    (PDF)
--   [Calling .... 2LO
-    Calling](http://www.sciencemuseum.org.uk/exhibitions/2lo/) The set
-    of equipment which transmitted the BBC’s first-ever programme
-
-Computer
---------
-
--   [Fördermaßnahmen zur Etablierung der Datenverarbeitung in
-    (West-)Deutschland. Von Konrad Zuse bis zum 1. DV-Programm des
-    Bundes 1967.](http://www.susas.de/computergeschichte_02.htm)
--   [Informatik und Rechentechnik in der
-    DDR](http://waste.informatik.hu-berlin.de/robotron/studienarbeit/index.html)
--   [EDV-Einführung in der DDR in der Epoche des "Neuen ökonomischen
-    Systems](http://www.susas.de/einfuehrung_edv_ddr_r300/index.htm)
--   [Kleincomputer in der
-    DDR](http://waste.informatik.hu-berlin.de/robotron/diplom/texte/einleitung/einleitung.html)
--   [Computersendungen im Rundfunk der
-    DDR](http://waste.informatik.hu-berlin.de/robotron/studienarbeit/files/literatur/rundfunk/rundfunk.html)
--   [Computergeschichte und
-    Militär](http://www.susas.de/computer_militaer/index.htm)
--   [Computer während Weltkrieg
-    zwei](http://robotron.informatik.hu-berlin.de/WW2/default.html)
--   [Adam Thornton: A Brief History of the Rice Computer.
-    1959-1971](http://www.princeton.edu/~adam/R1/r1rpt.html)
--   [Ivan Sutherland. Sketchpad: A man-machine graphical communication
-    system. Massachusetts: Ph. D. Thesis,
-    1963](http://www.cl.cam.ac.uk/TechReports/UCAM-CL-TR-574.pdf)
-    elektronische Version, 2003 (PDF)
--   [Jeff Johnson, Teresa L. Roberts: The Xerox "Star": A
-    Retrospective](http://digibarn.com/friends/curbow/star/retrospect/index.html)
--   [David Canfield Smith et al.Designing the Star User
-    Interface](http://www.aci.com.pl/mwichary/guidebook/articles/designingthestaruserinterface)
--   [Alan C. Kay. The Early History of
-    Smalltalk](http://gagne.homedns.org/~tgagne/contrib/EarlyHistoryST.html)
--   [Alan Kay: Doing with Images Makes Symbols Pt
-    1](http://www.archive.org/movies/details-db.php?collection=opensource_movies&collectionid=AV_Geek_Skip_20021212061248)
--   [Alan Kay: Doing with Images Makes Symbols Pt
-    2](http://www.archive.org/movies/details-db.php?collection=opensource_movies&collectionid=AV_Geek_Skip_20021212071234)
--   [Adele Goldberg, Alan C. Kay. Smalltalk72 Instruction
-    Manual](http://bitsavers.org/pdf/xerox/alto/Smalltalk72_Manual.pdf)
-    (PDF)
--   [Licklider, J. C. R. Man-Computer Symbiosis. IRE Transactions on
-    Human Factors in Electronics, HFE-1, 4-11,
-    1960](http://memex.org/licklider.pdf) (PDF)
--   [Licklider, J. C. R., & Taylor, R. The Computer as a Communication
-    Device. Science and Technology (4), 21-41,
-    1968](http://memex.org/licklider.pdf)
--   [William Henry Gates. An Open Letter to Hobbyists. February 3,
-    1976](http://www.blinkenlights.com/classiccmp/gateswhine.html)
--   [Dennis Mocigemba. Ideengeschichte der Computernutzung. Metaphern
-    der Computernutzung und
-    Qualitätssicherungsstrategien](http://edocs.tu-berlin.de/diss/2003/mocigemba_dennis.htm)
--   [Computer
-    Chronicles](http://www.archive.org/movies/computerchronicles.php) -
-    618 episodes
-
-Roboter
--------
-
--   [Leave It to
-    Roll-Oh](http://www.archive.org/movies/details-db.php?collection=prelinger&collectionid=07898)
-    Tongue-in-cheek film showing a domestic robot freeing housewives of
-    their chores (and intimating that their work is hardly necessary);
-    actually a promo showing how relays and switches function in the
-    modern automobile. Shown at the New York World's Fair in 1940.
-    (1940)
--   [Robots makes
-    radios](http://www.sciencemuseum.org.uk/on-line/ecme/) (1947)
-
-Vermischtes
------------
-
--   [Der Schwarze Kanal 1960-1989](http://dra.orb.de/) digitalisierte
-    Sendemanuskripte
--   [Technikgeschichte](http://fotothek.slub-dresden.de/index.html?/technik/technik.html)
-    Deutsche Fothothek, SUB Dresden
--   [The Early History of Talking
-    Machines](http://www.haskins.yale.edu/haskins/HEADS/simulacra.html)
--   ["Die telegraphischen Verbindungen Deutschlands mit seinen Kolonien"
-    von Ober Postpraktikant H. Thurn
-    Koblenz](http://www.jaduland.de/kolonien/text/televerbindung.html)
--   [Die modernen Medien der Weimarer
-    Republik](http://www.ralf-hecht.de/weimar/)
--   [120 Years of Electronic Music](http://www.obsolete.com/120_years/)
-    Electronic Musical Instrument 1870 - 1990
--   [Verbotene Bilder, manipulierte Filme
-    (I+II).](http://www.deutsches-filminstitut.de/dt2tai01.htm) Zur
-    Edition der Zensurentscheidungen der Berliner Film-Oberprüfstelle
-    aus den Jahren 1920 bis 1938
-
-Filme aus dem Archiv der CBC (in behämmertem Format)
-
--   [A Network called
-    "Internet"](http://archives.cbc.ca/IDC-1-75-710-4205/science_technology/computers/) 8.
-    Oktober 1993
--   [Kids and their
-    Computers](http://archives.cbc.ca/400d.asp?id=1-75-710-4186) 26.
-    Oktober 1982
--   [IDA, der
-    Geldautomat](http://archives.cbc.ca/400d.asp?id=1-75-710-4201) 12.
-    April 1968
-

content/veranstaltungen/bastelabend.md

@@ -1,32 +0,0 @@
----
-title: "Bastelabend"
-subtitle: "Der Bastelabend jeden 1. und 3. Samstag im Monat"
-date: 2025-01-08T20:00:00+02:00
-dtstart:  20250118T170000
-dtend:    20250118T230000
-rrule:   "FREQ=MONTHLY;BYDAY=1SA,3SA;WKST=MO"
-menu:
-  main:
-    parent: "Veranstaltungen"
-tag: ["Veranstaltung"]
-draft: true
----
-
-
-{{< figure
-    src="/img/club/27481933907_f240f4232d.jpg"
-    title="Lötkolben im CCCB"
-    alt="Lötkolben im CCCB"
-    caption="Lötkolben im CCCB"
->}}
-
-
-**Jeden 1. und 3. Samstag im Monat ist ab 17 Uhr Bastelabend im Club.**
-
-
-
-{{< alert "circle-info" >}}
-Wenn ihr neu seid und den CCCB zum ersten Mal besuchen wollt, kommt am besten an einem Donnerstag zum [Club Discordia](/veranstaltungen/clubdiscordia/), da samstags nicht immer genug Leute da sind, um euch zu empfangen.
-
-Generell sind aber alle, die schon mal im Club waren, herzlich eingeladen, an den Bastelabenden vorbeizukommen.
-{{< /alert >}}

content/veranstaltungen/chaosradio.md

@@ -19,7 +19,7 @@ tag: ["Veranstaltung"]
     caption="Chaosradio logo"
 >}}
 
-[Chaosradio](https://chaosradio.ccc.de) ist der Podcast des CCCB. Seit 2020 zeichen
+[Chaosradio](https://chaosradio.ccc.de) ist der Podcast des CCCB. Seit 2020 zeichnen
 wir ihn remote auf. Gelegentlich finden Sendungen vor Live-Publikum im Club, auf
 oder auf CCC-Veranstaltungen statt. Dies kündigen wir im Vorfeld separat an.
 

content/veranstaltungen/cms.md

@@ -42,7 +42,7 @@ Wissen der Menschheit. All diese Ziele werden auch vom Gesamtkonzept
 Internet getragen, weshalb es dem CCC naheliegt, sich genau dort als
 öffentlicher Ansprechpartner einzufinden, wo das Internet als Werkzeug
 im Alltag überall Einzug hält. Von:
-\[[München](http://schule.muc.ccc.de/%5DCCC)
+[München – CCC Schule](http://schule.muc.ccc.de/)
 
 Regelmäßige Treffen
 -------------------
@@ -208,7 +208,7 @@ Mailingliste
 
 Die Mailingliste richtet sich an alle, die bei Chaos macht Schule in
 Berlin aktiv sind. Subscribe-Anfragen von uns nicht bekannten Personen
-können wir deshalb leider nicht annehmen. Falls wir dich nicht nicht
+können wir deshalb leider nicht annehmen. Falls wir dich nicht
 kennen, komm doch gerne mal bei einem unserer Treffen vorbei.
 
 -   **Mitglieder-Liste:** <chaos-macht-schule@berlin.ccc.de>

content/veranstaltungen/neujahresempfang.md

@@ -1,7 +1,7 @@
 ---
 title: "Neujahresempfang"
 subtitle: "#NJE 26"
-date: 2025-03-05T18:00:00+02:00
+date: 2026-05-23T18:00:00+02:00
 dtstart:  20260523T180000
 dtend:    20260524T100000
 menu:

content/veranstaltungen/plenum.md

@@ -2,16 +2,16 @@
 title: "Plenum (club closed - members only)"
 subtitle: "Instrument der internen Konsensfindung"
 date: 2018-05-18T01:11:54+02:00
-dtstart: 20180704T200000
+dtstart: 20180710T200000
-dtend:   20180704T220000
+dtend:   20180710T220000
 rrule:   "FREQ=MONTHLY;BYDAY=2TU,4TU;INTERVAL=1;WKST=MO"
-tags: ["Mitgliedschaft", "Veranstaltung"]
+members_only: true
-draft: true
+tag: ["Mitgliedschaft", "Veranstaltung"]
 ---
 
 Das Plenum findet in der Regel am 2. und 4. Dienstag im Monat ab 20:00 Uhr in den Clubräumen
 des CCCB statt.
 
 Als Instrument der internen Konsensbildung, bei dem Interna diskutiert werden,
-richtet sich das Plenum **aussließlich an Mitglieder oder explizit eingeladene Gäste**.
+richtet sich das Plenum **ausschließlich an Mitglieder oder explizit eingeladene Gäste**.
 

content/veranstaltungen/spieleabend.md

@@ -2,8 +2,8 @@
 title: "Spieleabend"
 subtitle: "Der Spieleabend jeden 2. und 4. Samstag im Monat"
 date: 2025-01-08T20:00:00+02:00
-dtstart:  20250125T170000
+dtstart:  20250111T170000
-dtend:    20250125T230000
+dtend:    20250111T230000
 rrule:   "FREQ=MONTHLY;BYDAY=2SA,4SA;WKST=MO"
 menu:
   main: