Initial commit — existing SVN working copy (SVN r436)
This commit is contained in:
Johannes Bechberger
@@ -0,0 +1,428 @@
|
||||
<!doctype html>
|
||||
<html lang="de">
|
||||
|
||||
<head>
|
||||
<meta content="p2iJw_kklDL4_a17r87g1257yRJsluX_FYzG8fBegyw" name="google-site-verification" />
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "Event",
|
||||
"name": "Nacht der Wissenschaft 2026",
|
||||
"startDate": "2026-11-20T18:00:00+01:00",
|
||||
"endDate": "2026-11-21T04:00:00+01:00",
|
||||
"eventStatus": "https://schema.org/EventScheduled",
|
||||
"eventAttendanceMode": "https://schema.org/OfflineEventAttendanceMode",
|
||||
"location": {
|
||||
"@type": "RealLocation",
|
||||
"location": "Ehrenhof KIT"
|
||||
},
|
||||
"image": [
|
||||
"https://www.ndw-ka.de/images/logo.png"
|
||||
],
|
||||
"description": "Save the date: Am 20. November 2026 findet die nächste Nacht der Wissenschaft am KIT statt.",
|
||||
"organizer": {
|
||||
"@type": "Organization",
|
||||
"name": "Hochschulgruppe Nacht der Wissenschaft",
|
||||
"url": "https://www.ndw-ka.de/about-us.php"
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<script src="/js/i18n.js" defer></script>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta content="IE=edge" http-equiv="X-UA-Compatible">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" data-i18n-attrs="content:seo.description"
|
||||
content="Nacht der Wissenschaft am KIT – save the date: 20. November 2026. Jetzt mitmachen oder Dozentenvorschläge einreichen.">
|
||||
|
||||
<!-- Bootstrap CSS -->
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
|
||||
|
||||
<!-- Own CSS -->
|
||||
<link rel="stylesheet" href="css/styles.css">
|
||||
|
||||
<title data-i18n="site.title">Nacht der Wissenschaft</title>
|
||||
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32.png">
|
||||
<link rel="icon" type="image/png" sizes="192x192" href="/favicon-192.png">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
<link rel="shortcut icon" href="/favicon.ico">
|
||||
|
||||
<meta name="theme-color" content="#000000">
|
||||
</head>
|
||||
|
||||
<body class="text-white">
|
||||
<a class="visually-hidden-focusable position-absolute top-0 start-0 p-2" href="#main-content">Zum Inhalt springen</a>
|
||||
|
||||
<header class="mb-5" id="header">
|
||||
<nav class="d-flex align-items-center w-100" aria-label="Hauptnavigation">
|
||||
|
||||
<!-- Desktop -->
|
||||
<div class="d-none d-md-block ms-auto">
|
||||
<ul class="nav flex-row gap-4 align-items-center">
|
||||
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle p-0" href="#" id="archivDropdown" role="button"
|
||||
data-bs-toggle="dropdown" aria-expanded="false" data-i18n="archive"></a>
|
||||
<ul class="dropdown-menu dropdown-menu-dark dropdown-menu-end" aria-labelledby="archivDropdown">
|
||||
<li><a class="dropdown-item" href="/archiv/november2025/" data-i18n="archive.november2025"></a></li>
|
||||
<li><a class="dropdown-item" href="/archiv/november2024/" data-i18n="archive.november2024"></a></li>
|
||||
<li><a class="dropdown-item" href="/archiv/november2023/" data-i18n="archive.november2023"></a></li>
|
||||
<li><a class="dropdown-item" href="/archiv/november2022/" data-i18n="archive.november2022"></a></li>
|
||||
<li><a class="dropdown-item" href="/archiv/november2021/" data-i18n="archive.november2021"></a></li>
|
||||
<li><a class="dropdown-item" href="/archiv/november2020/" data-i18n="archive.november2020"></a></li>
|
||||
<li><a class="dropdown-item" href="/archiv/januar2020/" data-i18n="archive.january2020"></a></li>
|
||||
<li><a class="dropdown-item" href="/archiv/november2018/" data-i18n="archive.november2018"></a></li>
|
||||
<li><a class="dropdown-item" href="/archiv/november2017/" data-i18n="archive.november2017"></a></li>
|
||||
<li><a class="dropdown-item" href="/archiv/oktober2016/" data-i18n="archive.october2016"></a></li>
|
||||
<li><a class="dropdown-item" href="/archiv/januar2016/" data-i18n="archive.january2016"></a></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<span class="lang-switcher">
|
||||
<button class="js-set-lang lang-btn" data-lang="de" type="button">DE</button>
|
||||
<span class="lang-sep">|</span>
|
||||
<button class="js-set-lang lang-btn" data-lang="en" type="button">EN</button>
|
||||
</span>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Mobile burger -->
|
||||
<div class="dropdown d-md-none ms-auto">
|
||||
<button class="btn p-0 burger" type="button" data-bs-toggle="dropdown" data-bs-auto-close="outside"
|
||||
aria-expanded="false" aria-label="Menü öffnen">
|
||||
<svg width="28" height="28" viewBox="0 0 24 24" class="burger-icon" aria-hidden="true">
|
||||
<rect x="3" y="6" width="18" height="2" rx="1"></rect>
|
||||
<rect x="3" y="11" width="18" height="2" rx="1"></rect>
|
||||
<rect x="3" y="16" width="18" height="2" rx="1"></rect>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<div class="dropdown-menu dropdown-menu-dark dropdown-menu-end mt-2 p-0" style="min-width:14rem;">
|
||||
|
||||
<button class="dropdown-item d-flex justify-content-between align-items-center" type="button"
|
||||
data-bs-toggle="collapse" data-bs-target="#m-archiv" aria-expanded="false" aria-controls="m-archiv">
|
||||
<span class="label text-nowrap" data-i18n="archive">Archiv</span>
|
||||
<span class="caret ms-2" aria-hidden="true">▾</span>
|
||||
</button>
|
||||
<div id="m-archiv" class="collapse">
|
||||
<a class="dropdown-item ps-4" href="/archiv/november2025/" data-i18n="archive.november2025"></a>
|
||||
<a class="dropdown-item ps-4" href="/archiv/november2024/" data-i18n="archive.november2024"></a>
|
||||
<a class="dropdown-item ps-4" href="/archiv/november2023/" data-i18n="archive.november2023"></a>
|
||||
<a class="dropdown-item ps-4" href="/archiv/november2022/" data-i18n="archive.november2022"></a>
|
||||
<a class="dropdown-item ps-4" href="/archiv/november2021/" data-i18n="archive.november2021"></a>
|
||||
<a class="dropdown-item ps-4" href="/archiv/november2020/" data-i18n="archive.november2020"></a>
|
||||
<a class="dropdown-item ps-4" href="/archiv/januar2020/" data-i18n="archive.january2020"></a>
|
||||
<a class="dropdown-item ps-4" href="/archiv/november2018/" data-i18n="archive.november2018"></a>
|
||||
<a class="dropdown-item ps-4" href="/archiv/november2017/" data-i18n="archive.november2017"></a>
|
||||
<a class="dropdown-item ps-4" href="/archiv/oktober2016/" data-i18n="archive.october2016"></a>
|
||||
<a class="dropdown-item ps-4" href="/archiv/januar2016/" data-i18n="archive.january2016"></a>
|
||||
</div>
|
||||
|
||||
<div class="dropdown-divider mx-0 my-0" style="border-color:rgba(255,255,255,.1)"></div>
|
||||
<button class="dropdown-item js-set-lang lang-btn d-flex justify-content-between align-items-center" type="button" data-lang="de">
|
||||
<span>Deutsch</span><span class="lang-mobile-tag">DE</span>
|
||||
</button>
|
||||
<button class="dropdown-item js-set-lang lang-btn d-flex justify-content-between align-items-center" type="button" data-lang="en">
|
||||
<span>English</span><span class="lang-mobile-tag">EN</span>
|
||||
</button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main id="main-content" tabindex="-1">
|
||||
|
||||
<!-- Hero -->
|
||||
<section class="hero-wrapper text-white" aria-labelledby="page-title">
|
||||
<div class="container-fluid p-0">
|
||||
<div class="row gx-3 gy-5 align-items-center">
|
||||
<div class="col-12 col-lg-8">
|
||||
<h1 id="page-title" class="hero-headline">
|
||||
Nacht der Wissenschaft<br>
|
||||
<span class="fw-normal" data-i18n="date.of.event"></span>
|
||||
<span class="hero-location" data-i18n="hero.location">am KIT, Karlsruhe</span>
|
||||
</h1>
|
||||
<p class="hero-tagline" data-i18n="hero.tagline">Save the date!</p>
|
||||
|
||||
<div class="hero-cta d-flex flex-row flex-wrap gap-2
|
||||
justify-content-center justify-content-lg-start
|
||||
align-items-center align-items-lg-start
|
||||
text-center text-lg-start">
|
||||
|
||||
<a class="btn btn-outline-light-custom text-center" href="#mitmachen"
|
||||
data-i18n="cta.join">Mitmachen</a>
|
||||
|
||||
<a class="btn btn-outline-light-custom d-inline-flex align-items-center gap-2 text-center"
|
||||
href="https://www.instagram.com/ndw_karlsruhe/" target="_blank" rel="noopener"
|
||||
aria-label="Instagram @ndw_karlsruhe">
|
||||
<svg style="width:1.1em;height:1.1em;fill:currentColor;flex-shrink:0" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z"/></svg>
|
||||
@ndw_karlsruhe
|
||||
</a>
|
||||
|
||||
<!-- Add to calendar dropdown (same as 2025, updated dates) -->
|
||||
<div class="dropdown hero-dropdown">
|
||||
<button id="addToCalBtn" class="btn btn-light-custom text-center" type="button"
|
||||
data-bs-toggle="dropdown" aria-expanded="false" data-i18n="cta.calendar">
|
||||
Zum Kalender hinzufügen
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-dark mt-2" aria-labelledby="addToCalBtn">
|
||||
<li><a class="dropdown-item"
|
||||
href="https://calendar.google.com/calendar/render?action=TEMPLATE&text=Nacht%20der%20Wissenschaft&dates=20261120T170000Z/20261121T030000Z&ctz=Europe%2FBerlin&details=Mehr%20Infos%3A%20https%3A%2F%2Fwww.ndw-ka.de%2F"
|
||||
target="_blank" rel="noopener">Google Calendar</a></li>
|
||||
<li><a class="dropdown-item" href="/nacht-der-wissenschaft-2026.ics" download>Apple</a></li>
|
||||
<li><a class="dropdown-item"
|
||||
href="https://outlook.live.com/calendar/0/action/compose?rru=addevent&startdt=2026-11-20T18:00:00&enddt=2026-11-21T04:00:00&subject=Nacht%20der%20Wissenschaft&body=Mehr%20Infos%3A%20https%3A%2F%2Fwww.ndw-ka.de"
|
||||
target="_blank" rel="noopener">Outlook</a></li>
|
||||
<li><a class="dropdown-item" href="/nacht-der-wissenschaft-2026.ics" download
|
||||
data-i18n="ical.file">iCal Datei</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<aside class="col-12 col-lg-4 text-lg-end text-center" aria-labelledby="hero-graphic-caption">
|
||||
<img src="images/logo.png" class="hero-graphic img-fluid" alt="" loading="lazy">
|
||||
<p id="hero-graphic-caption" class="visually-hidden">Logo der Nacht der Wissenschaft</p>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- About (short) -->
|
||||
<section class="about-section text-white" id="about" aria-labelledby="about-heading">
|
||||
<div class="container-fluid">
|
||||
<h2 id="about-heading" class="section-heading" data-i18n="about.heading">Wer wir sind</h2>
|
||||
|
||||
<div class="about-row">
|
||||
<figure class="about-visual bleed-left">
|
||||
<img src="images/moon.png" class="about-image" loading="lazy" alt="Mond vor dunklem Nachthimmel.">
|
||||
<figcaption class="visually-hidden">Symbolbild zur Nacht der Wissenschaft</figcaption>
|
||||
</figure>
|
||||
|
||||
<article class="about-content">
|
||||
<h3 class="about-title" data-i18n="about.title">Nacht der Wissenschaft @ KIT</h3>
|
||||
<p class="about-body" data-i18n="about.body.short"></p>
|
||||
<a href="/archiv/november2025/" class="about-archive-link" data-i18n="about.lastyear.link">Zum Programm 2025 →</a>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Featured talk -->
|
||||
<section class="talk-section text-white" id="vortraege" aria-labelledby="talk-heading">
|
||||
<div class="container-fluid">
|
||||
<h2 id="talk-heading" class="section-heading" data-i18n="talk.heading">Vorträge zum Nachschauen</h2>
|
||||
|
||||
<!-- JS version (populated dynamically) -->
|
||||
<div class="talk-feature" id="talk-feature-js" style="display:none">
|
||||
<div class="talk-feature-embed">
|
||||
<div class="talk-embed-ratio">
|
||||
<iframe id="talk-iframe"
|
||||
src="about:blank"
|
||||
title=""
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
||||
allowfullscreen
|
||||
loading="lazy"
|
||||
referrerpolicy="strict-origin-when-cross-origin">
|
||||
</iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div class="talk-feature-info">
|
||||
<p class="talk-feature-year" id="talk-year"></p>
|
||||
<h3 class="talk-feature-title" id="talk-title"></h3>
|
||||
<p class="talk-feature-speaker"><span data-i18n="talk.label">Vortrag von</span> <span id="talk-speaker"></span></p>
|
||||
<p class="talk-feature-desc" id="talk-desc"></p>
|
||||
<a class="talk-feature-link" id="talk-link" href="#" target="_blank" rel="noopener" data-i18n="talk.watch">Auf YouTube ansehen →</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- No-JS fallback: always visible until JS kicks in -->
|
||||
<div class="talk-feature" id="talk-feature-noscript">
|
||||
<div class="talk-feature-embed">
|
||||
<div class="talk-embed-ratio">
|
||||
<iframe
|
||||
src="https://www.youtube-nocookie.com/embed/EKnzvrEqCY0"
|
||||
title="SUPRALEITUNG! – NdW 2024, Prof. Dr. Jörg Schmalian"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
||||
allowfullscreen
|
||||
loading="lazy"
|
||||
referrerpolicy="strict-origin-when-cross-origin">
|
||||
</iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div class="talk-feature-info">
|
||||
<p class="talk-feature-year">NdW 2024</p>
|
||||
<h3 class="talk-feature-title">SUPRALEITUNG!</h3>
|
||||
<p class="talk-feature-speaker">Prof. Dr. Jörg Schmalian</p>
|
||||
<p class="talk-feature-desc">Ein Vortrag über eines der faszinierendsten Phänomene der modernen Physik – und warum es die Welt verändern könnte.</p>
|
||||
<a class="talk-feature-link" href="https://www.youtube.com/watch?v=EKnzvrEqCY0" target="_blank" rel="noopener">Auf YouTube ansehen →</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
<script>
|
||||
fetch('/data/featured-talks.json')
|
||||
.then(r => r.json())
|
||||
.then(talks => {
|
||||
const t = talks[Math.floor(Math.random() * talks.length)];
|
||||
const lang = (localStorage.getItem('lang') || document.documentElement.lang || 'de').slice(0,2);
|
||||
document.getElementById('talk-iframe').src = 'https://www.youtube-nocookie.com/embed/' + t.youtubeId;
|
||||
document.getElementById('talk-iframe').title = t.titleDe + ' – NdW ' + t.year;
|
||||
document.getElementById('talk-year').innerHTML = '<span data-i18n="talk.ndw">NdW</span> ' + t.year;
|
||||
const titleEl = document.getElementById('talk-title');
|
||||
titleEl.textContent = lang === 'en' ? t.titleEn : t.titleDe;
|
||||
titleEl.setAttribute('data-lang-de', t.titleDe);
|
||||
titleEl.setAttribute('data-lang-en', t.titleEn);
|
||||
document.getElementById('talk-speaker').textContent = t.speaker;
|
||||
const descEl = document.getElementById('talk-desc');
|
||||
descEl.textContent = lang === 'en' ? t.descEn : t.descDe;
|
||||
descEl.setAttribute('data-lang-de', t.descDe);
|
||||
descEl.setAttribute('data-lang-en', t.descEn);
|
||||
document.getElementById('talk-link').href = 'https://www.youtube.com/watch?v=' + t.youtubeId;
|
||||
document.getElementById('talk-feature-js').style.display = '';
|
||||
document.getElementById('talk-feature-noscript').style.display = 'none';
|
||||
});
|
||||
</script>
|
||||
|
||||
<!-- Join / Contact / Dozentenvorschläge -->
|
||||
<section class="join-section text-white" id="mitmachen" aria-labelledby="join-heading">
|
||||
<div class="container-fluid">
|
||||
<h2 id="join-heading" class="section-heading" data-i18n="join.heading">Mitmachen & Kontakt</h2>
|
||||
|
||||
<p class="about-body mb-4" data-i18n="join.body"></p>
|
||||
|
||||
<div class="join-cards">
|
||||
|
||||
<div class="join-card hall-card">
|
||||
<div class="join-card-icon" aria-hidden="true">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" width="28" height="28"><rect x="9" y="2" width="6" height="11" rx="3"/><path d="M5 10a7 7 0 0 0 14 0"/><line x1="12" y1="17" x2="12" y2="22"/><line x1="8" y1="22" x2="16" y2="22"/></svg>
|
||||
</div>
|
||||
<p data-i18n="join.dozenten"></p>
|
||||
</div>
|
||||
|
||||
<div class="join-card hall-card">
|
||||
<div class="join-card-icon" aria-hidden="true">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" width="28" height="28"><path d="M20.42 4.58a5.4 5.4 0 0 0-7.65 0l-.77.78-.77-.78a5.4 5.4 0 0 0-7.65 7.65l8.42 8.42 8.42-8.42a5.4 5.4 0 0 0 0-7.65z"/></svg>
|
||||
</div>
|
||||
<p data-i18n="join.team"></p>
|
||||
</div>
|
||||
|
||||
<div class="join-card hall-card">
|
||||
<div class="join-card-icon" aria-hidden="true">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" width="28" height="28"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline points="22,6 12,13 2,6"/></svg>
|
||||
</div>
|
||||
<ul class="contact-links list-unstyled mb-0">
|
||||
<li>
|
||||
<a href="https://www.instagram.com/ndw_karlsruhe/" class="contact-link" target="_blank" rel="noopener">
|
||||
<svg class="contact-icon" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z"/></svg>
|
||||
@ndw_karlsruhe
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="mailto:info@ndw-ka.de" class="contact-link">
|
||||
<svg class="contact-icon" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/></svg>
|
||||
info@ndw-ka.de
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="join-card hall-card" id="ndw-events-card">
|
||||
<div class="join-card-icon" aria-hidden="true">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" width="28" height="28"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"/><line x1="16" y1="2" x2="16" y2="6"/><line x1="8" y1="2" x2="8" y2="6"/><line x1="3" y1="10" x2="21" y2="10"/></svg>
|
||||
</div>
|
||||
<p data-i18n="join.events.heading" style="font-weight:600;margin-bottom:.5rem"></p>
|
||||
<ul id="ndw-event-list" class="list-unstyled mb-2" style="font-size:.9rem">
|
||||
<li data-i18n="join.events.loading"></li>
|
||||
</ul>
|
||||
<a id="ndw-ical-link"
|
||||
href="<?= htmlspecialchars('https://v2202606368123470420.bestsrv.de/remote.php/dav/public-calendars/acfadeb0ffc80a874a310552267cddc1/?export') ?>"
|
||||
class="contact-link" style="font-size:.85rem" data-i18n="join.events.ical">
|
||||
Kalender abonnieren (iCal)
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
var PROXY = '/calendar-proxy.php';
|
||||
var list = document.getElementById('ndw-event-list');
|
||||
if (!list) return;
|
||||
|
||||
function i18nKey(key) {
|
||||
if (window._i18n && window._i18n[key]) return window._i18n[key];
|
||||
var el = document.querySelector('[data-i18n="' + key + '"]');
|
||||
return el ? el.textContent : key;
|
||||
}
|
||||
|
||||
function parseICS(text) {
|
||||
var events = [];
|
||||
var blocks = text.split('BEGIN:VEVENT');
|
||||
for (var i = 1; i < blocks.length; i++) {
|
||||
var b = blocks[i];
|
||||
var sumMatch = b.match(/\nSUMMARY:([^\r\n]+)/);
|
||||
var startMatch = b.match(/\nDTSTART[^:]*:([^\r\n]+)/);
|
||||
if (!sumMatch || !startMatch) continue;
|
||||
var ds = startMatch[1].trim().replace(/[TZ]/g, '').slice(0, 12);
|
||||
var yr = ds.slice(0,4), mo = ds.slice(4,6), dy = ds.slice(6,8);
|
||||
var hr = ds.slice(8,10) || '00', mi = ds.slice(10,12) || '00';
|
||||
var dt = new Date(yr, mo-1, dy, hr, mi);
|
||||
if (dt >= new Date()) {
|
||||
events.push({ summary: sumMatch[1].trim(), date: dt, allday: startMatch[1].trim().length === 8 });
|
||||
}
|
||||
}
|
||||
events.sort(function(a,b){ return a.date - b.date; });
|
||||
return events.slice(0, 4);
|
||||
}
|
||||
|
||||
function renderEvents(events) {
|
||||
if (!events.length) {
|
||||
list.innerHTML = '<li>' + i18nKey('join.events.none') + '</li>';
|
||||
return;
|
||||
}
|
||||
var html = '';
|
||||
events.forEach(function(e) {
|
||||
var d = e.date;
|
||||
var dateStr = ('0'+d.getDate()).slice(-2) + '.' + ('0'+(d.getMonth()+1)).slice(-2) + '.' + d.getFullYear();
|
||||
var timeStr = e.allday ? '' : ' ' + ('0'+d.getHours()).slice(-2) + ':' + ('0'+d.getMinutes()).slice(-2);
|
||||
html += '<li>📅 ' + dateStr + timeStr + ' – ' + e.summary.replace(/</g,'<') + '</li>';
|
||||
});
|
||||
list.innerHTML = html;
|
||||
}
|
||||
|
||||
fetch(PROXY)
|
||||
.then(function(r){ return r.ok ? r.text() : Promise.reject(r.status); })
|
||||
.then(function(txt){ renderEvents(parseICS(txt)); })
|
||||
.catch(function(){ list.innerHTML = '<li>' + i18nKey('join.events.none') + '</li>'; });
|
||||
})();
|
||||
</script>
|
||||
|
||||
</main>
|
||||
|
||||
<footer class="about-footer">
|
||||
<nav class="about-nav" aria-label="Sekundäre Navigation">
|
||||
<ul class="about-nav-list">
|
||||
<li><a href="#main-content">Start</a></li>
|
||||
<li><a href="./impressum.php" data-i18n="impressum">Impressum</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</footer>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user