Testseite: Unterschied zwischen den Versionen
Aus Bündnis für Familie Tübingen.
Keine Bearbeitungszusammenfassung |
Keine Bearbeitungszusammenfassung |
||
| (Eine dazwischenliegende Version desselben Benutzers wird nicht angezeigt) | |||
| Zeile 17: | Zeile 17: | ||
--accent-dark: #115e59; | --accent-dark: #115e59; | ||
--accent-soft: #ecfdf5; | --accent-soft: #ecfdf5; | ||
--radius: 16px; | --radius: 16px; | ||
} | } | ||
| Zeile 170: | Zeile 169: | ||
<main class="wrap"> | <main class="wrap"> | ||
<h1>Viele Formen von Familie</h1> | <h1>Viele Formen von Familie</h1> | ||
<p class="intro">Hier findet ihr eine Übersicht über das gesamte Programm zur Ausstellung. Die Ausstellung ist von Anfang Oktober bis Dezember 2026 in der Hauptstelle der | <p class="intro">Hier findet ihr eine Übersicht über das gesamte Programm zur Ausstellung. Die Ausstellung ist von Anfang Oktober bis Dezember 2026 in der Hauptstelle der Stadtbibliothek (Kinder- und Jugendbereich sowie 1. Stock) und im Stadtmuseum zu sehen.</p> | ||
<p class="notice"><strong>In | <p class="notice"><strong>In Kl&ruml;rung:</strong> Kino – drei Sonntagsmatineen mit Familienfilmen.</p> | ||
<div id="calendar"></div> | |||
< | |||
</main> | </main> | ||
<dialog id="eventDialog" class="event-dialog" aria-labelledby="dialogTitle"> | <dialog id="eventDialog" class="event-dialog" aria-labelledby="dialogTitle"> | ||
<div class="dialog-inner"> | <div class="dialog-inner"> | ||
<button type="button" class="dialog-close" id="dialogClose" aria-label="Details schließen"> | <button type="button" class="dialog-close" id="dialogClose" aria-label="Details schließen">×</button> | ||
<h2 id="dialogTitle" class="dialog-title"></h2> | <h2 id="dialogTitle" class="dialog-title"></h2> | ||
<p id="dialogDate" class="dialog-date"></p> | <p id="dialogDate" class="dialog-date"></p> | ||
| Zeile 291: | Zeile 190: | ||
<script> | <script> | ||
/* | |||
===================================================== | |||
HIER ANGEBOTE ERGĨNZEN | |||
===================================================== | |||
Jedes Angebot ist ein Objekt mit diesen Feldern: | |||
- year: 2026 | |||
- month: 10 (Oktober) oder 11 (November) oder 12 (Dezember) | |||
- day: 1 bis 31 | |||
- time: z. B. "18:00 Uhr" oder "09:00–11:00 Uhr" oder "Ganzt䨤gig" | |||
- title: Kurzer Titel der Veranstaltung | |||
- audience: Zielgruppe | |||
- place: Ort / Treffpunkt | |||
- description: Längere Beschreibung (mehrzeilig erlaubt) | |||
- link: Optional, z. B. "https://..." oder "mailto:..." | |||
Einfach ein neues Objekt in die passende Monatsliste einfügen. | |||
*/ | |||
const events = [ | |||
// Oktober 2026 | |||
{ year: 2026, month: 10, day: 6, time: "20:00–21:00 Uhr", title: "Hochsensible Kinder gut unterstützen und begleiten", audience: "Eltern", place: "Digitales Format", description: "Eltern sein in Tübingen – so geht's leichter! Welche konkreten Tipps haben Tübinger Expert*innen für Eltern von jüngeren und älteren Kindern – zu Erziehungsthemen, aber auch zu Herausforderungen, die das Elternsein mit sich bringt?\n\nDiese Online-Themenreihe ist eine Kooperation der Universitätsstadt Tübingen mit der Familien-Bildungsstätte (FBS) und dem Bündnis für Familie (BüFa).\n\nNach der Anmeldung erhalten Sie einen Zoom-Zugangscode. Ein eigener Zoom-Account ist nicht erforderlich.", link: "https://www.fbs-tuebingen.de/eltern-und-lebensthemen" }, | |||
{ year: 2026, month: 10, day: 8, time: "18:00 Uhr", title: "Filmvorführung mit Gespräch über den Film „All Inclusive“", audience: "Alle Generationen, für Kinder ab 7 Jahren", place: "Aula des Uhland-Gymnasiums, Uhlandstraße 24, 72072 Tübingen", description: "Filmvorführung mit Gespräch über den Film „All Inclusive“. Die Veranstaltung wird vom Interkulturellen Mehrgenerationenhaus InFö e. V. und der Lebenshilfe veranstaltet." }, | |||
{ year: 2026, month: 10, day: 9, time: "15:00 Uhr", title: "Vorlesezeit in französischer Sprache mit dem LESE-HAUS", audience: "Kinder von 4 bis 8 Jahren", place: "Stadtbücherei Tübingen, Nonnengasse 19, Thekla-Waitz-Studio", description: "Geschichten und Lieder auf Französisch laden Kinder spielerisch dazu ein, erste Eindrücke der Sprache zu sammeln. Mitarbeitende des Institut Culturel Franco-Allemand (ICFA) gestalten diese besondere Vorlesezeit rund um das Thema Familie." }, | |||
{ year: 2026, month: 10, day: 9, time: "16:00 Uhr", title: "Vorlesezeit mit dem LESE-HAUS", audience: "Kinder von 4 bis 8 Jahren", place: "Stadtbücherei Tübingen, Nonnengasse 19, Thekla-Waitz-Studio", description: "Bei dieser Vorlesezeit auf Deutsch stehen Geschichten rund um das Thema Familie im Mittelpunkt – mal lustig, mal spannend, mal berührend." }, | |||
{ year: 2026, month: 10, day: 9, time: "17:00 Uhr", title: "Vorlesezeit in ukrainischer Sprache mit dem LESE-HAUS", audience: "Kinder von 4 bis 8 Jahren", place: "Stadtbücherei Tübingen, Nonnengasse 19, Thekla-Waitz-Studio", description: "Lesepatinnen aus der Ukraine lesen Geschichten in ihrer Muttersprache und geben Einblicke in ukrainische Erzähltraditionen rund um das Thema Familie." }, | |||
{ year: 2026, month: 10, day: 21, time: "17:00 Uhr", title: "Familiensprachen und Sprachencafés im elkiko Familienzentrum", audience: "Tübinger Familien und Interessierte", place: "Stadtbücherei, Hauptstelle", description: "Mitmachangebote zum Thema Familiensprachen sowie Informationen zu den Sprachencafés im elkiko Familienzentrum." }, | |||
{ year: 2026, month: 10, day: 22, time: "18:00 Uhr", title: "Preisverleihung des 23. Schreibwettbewerbs für junge Menschen der Buchhandlung Wekenmann", audience: "Alle Interessierten", place: "Museumsgesellschaft Obere Säle, Wilhelmstraße 3, Tübingen", description: "Festliche Preisverleihung: Die sechs Preisträger*innen des Schreibwettbewerbs „We are family“ lesen aus ihren Siegertexten. Dr. Daniela Hüttig, Erste Landesbeamtin und Schirmherrin des Wettbewerbs, spricht ein Grußwort. Musikalisch umrahmt wird der Abend von Singer/Songwriter Jakob Longfield." }, | |||
{ year: 2026, month: 10, day: 31, time: "15:00 Uhr", title: "BamBam-Band & Halloween Fair for Kids", audience: "Familien mit Kindern ab 3 Jahren", place: "d.a.i. Tübingen, Karlstraße 3, Tübingen", description: "Konzert und Halloween für die ganze Familie. Ab 15 Uhr spielt die BamBam-Band. Ab 16 Uhr heißt es Trick or Treat: Kinderdisco, Basteln, Gaming und jede Menge Spaß mit Popcorn und Snacks.\n\nAlles kostenfrei auf Spendenbasis. Kostüme sind sehr willkommen. Die Veranstaltung findet in deutscher und englischer Sprache statt.", link: "https://www.dai-tuebingen.de/bambam" }, | |||
// November 2026 | |||
{ year: 2026, month: 11, day: 5, time: "09:00–11:00 Uhr", title: "„Der Widerspenstigen Zähmung?“ – Workshop", audience: "Eltern von Kindern im Vorschulalter", place: "Jugend- und Familienberatungszentrum Tübingen, Bismarckstraße 110, 72072 Tübingen, 2. Stock", description: "Manche Kinder sind Weltmeister darin, Erwachsene an ihre Grenzen zu bringen. Gemeinsam soll ein Verständnis für als schwierig empfundene kindliche Verhaltensweisen entwickelt werden. Ziel ist außerdem, neue Reaktionsweisen auszuprobieren, um unnötige Machtkämpfe im Familienalltag zu vermeiden.", link: "mailto:jfbz-tue@kreis-tuebingen.de" }, | |||
{ year: 2026, month: 11, day: 5, time: "19:00 Uhr", title: "Nach der Elternzeit – welche Betreuung passt für mein Kind und unsere Familie?", audience: "(Werdende) Eltern, die sich über Kleinkindbetreuung informieren möchten", place: "Online", description: "Um eine passende Betreuung nach der Elternzeit zu finden, braucht es einen Überblick über die verschiedenen Möglichkeiten der Kinderbetreuung. Welches Modell passt für welches Kind und welche Familie, welche Kriterien können eine Rolle spielen und was sind die Besonderheiten der Kindertagespflege?", link: "mailto:info@tageselternverein.de" }, | |||
{ year: 2026, month: 11, day: 9, time: "18:00–20:00 Uhr", title: "Wassergewöhnung – wie unterstütze ich mein Kind?", audience: "Alle Eltern und Erziehungsberechtigten", place: "Hirsch Begegnungsstätte, Hirschgasse 9, 72070 Tübingen", description: "Schwimmen für alle Kinder informiert zu einem besseren Verständnis von Wassergewöhnung. Enthalten sind alltagspraktische Übungen für Kinder vor dem Schwimmkurs. Eintritt frei, Getränke gegen Spende." }, | |||
{ year: 2026, month: 11, day: 10, time: "18:00 Uhr", title: "Live-Show mit Miriam Davoudvandi: Das können wir uns nicht leisten", audience: "Alle Interessierten", place: "Gemeindehaus Lamm, Großer Saal 1, Am Markt 7, Tübingen", description: "Was es bedeutet, in Deutschland arm aufzuwachsen: Journalistin und Podcasterin Miriam Davoudvandi (aka Cashmiri) bringt mit dem aktuellen Buch „Das können wir uns nicht leisten“ ihre Geschichte mit Texten, persönlichen Geschichten, Humor und Pop auf die Bühne." }, | |||
{ year: 2026, month: 11, day: 10, time: "17:00–19:00 Uhr", title: "Das Geheimnis des Bildungserfolgs, Teil 1: Entwicklungsaufgaben", audience: "Eltern von Kindern der 1. bis 6. Klasse", place: "Brückenhaus, Werkstraße 8, 72074 Tübingen", description: "Teil 1: Entwicklungsaufgaben, Eltern-Kind-Bindung, Mutter und Vater als Unterstützer*innen, Lernen und Selbstwirksamkeit. Wie können Eltern ihr Kind unterstützen, damit es in der Schule gut zurechtkommt? Zu diesen Fragen gibt es jeweils einen kurzen Vortrag auf Deutsch, Englisch, Arabisch und Persisch." }, | |||
{ year: 2026, month: 11, day: 11, time: "19:00–21:00 Uhr", title: "„Zu Hause in einer Erziehungsstelle“ – Podiumsdiskussion", audience: "Eltern", place: "Lorettoplatz 30, Tübingen", description: "Vorstellung von kit jugendhilfe mit dem Schwerpunkt auf professionellen Pflegefamilien und anschließender Diskussionsrunde. Eine kurze Rückmeldung zur Teilnahme wäre schön, ist aber nicht zwingend notwendig.", link: "mailto:andrea.leitgeb@kit-jugendhilfe.de" }, | |||
{ year: 2026, month: 11, day: 15, time: "14:00–17:00 Uhr", title: "Familienbasteln im Café frieDa", audience: "Familien mit Kindern, 0 bis 99 Jahre", place: "Café frieDa, Friedrich-Dannenmann-Straße 69, 72070 Tübingen", description: "Bunte Bastelstunde im Café frieDa mit Angeboten für die ganz Kleinen und Größeren. Unter anderem werden Leinenbeutel bemalt und bedruckt. Für die großen Gäste gibt es Kaffee und Kuchen auf Spendenbasis. Keine Anmeldung erforderlich." }, | |||
{ year: 2026, month: 11, day: 17, time: "17:00–19:00 Uhr", title: "Das Geheimnis des Bildungserfolgs, Teil 2: Erfolg in Schule, Bildung und Teilhabe", audience: "Eltern von Kindern der 1. bis 6. Klasse", place: "Brückenhaus, Werkstraße 8, 72074 Tübingen", description: "Das Geheimnis des Bildungserfolgs – was Ihr Kind von Ihnen als Mutter und Vater braucht. Drei internationale Präsenz-Elternabende auf Deutsch, Englisch, Arabisch und Persisch für Eltern von Kindern der 1. bis 6. Klasse." }, | |||
{ year: 2026, month: 11, day: 19, time: "09:30–11:30 Uhr", title: "Zutaten für ein starkes Familienleben", audience: "Eltern mit Kindern im Alter von 0 bis 3 Jahren", place: "Jugend- und Familienberatungszentrum Tübingen, Bismarckstraße 110, 72072 Tübingen, 2. Stock", description: "Rezeptideen für ein starkes Familienleben – Zutaten: Feinfühligkeit, Zeit, Vertrauen und mehr. In gemütlicher und kleinkindorientierter Atmosphäre wird gemeinsam darüber gesprochen, was für ein starkes Familienleben sorgt.", link: "mailto:fruehehilfen@kreis-tuebingen.de" }, | |||
{ year: 2026, month: 11, day: 21, time: "10:00–15:00 Uhr", title: "Bastelspaß für die ganze Familie – Thanksgiving Edition", audience: "Familien mit Kindern aller Altersgruppen", place: "d.a.i. Tübingen, Karlstraße 3, Bibliothek", description: "Kommen Sie ins d.a.i. Tübingen und basteln Sie gemeinsam wunderschöne Thanksgiving-Dekorationen. Feiern Sie den Tag der Dankbarkeit bei einer gemütlichen Bastelrunde in der d.a.i.-Bibliothek." }, | |||
{ year: 2026, month: 11, day: 24, time: "17:00–19:00 Uhr", title: "Das Geheimnis des Bildungserfolgs, Teil 3: Medienerziehung", audience: "Eltern von Kindern der 1. bis 6. Klasse", place: "Brückenhaus, Werkstraße 8, 72074 Tübingen", description: "Das Geheimnis des Bildungserfolgs – was Ihr Kind von Ihnen als Mutter und Vater braucht. Drei internationale Präsenz-Elternabende auf Deutsch, Englisch, Arabisch und Persisch." }, | |||
{ year: 2026, month: 11, day: 24, time: "Ganztägig", title: "Gemeinsam gegen Abfall – Papierrecycling in der Stadtbücherei", audience: "Familien", place: "Stadtbücherei Tübingen, Nonnengasse 19, Tübingen", description: "Im Rahmen der Europäischen Woche der Abfallvermeidung bietet die Stadtbücherei Tübingen eine besondere Mitmachaktion an: An einem Papierbindetisch können aus einseitig bedrucktem Altpapier Spiralblöcke hergestellt werden. Papier ist vor Ort verfügbar, kann aber auch gerne mitgebracht werden." }, | |||
{ year: 2026, month: 11, day: 25, time: "Ganztägig", title: "Gemeinsam gegen Abfall – Papierrecycling in der Stadtbücherei", audience: "Familien", place: "Stadtbücherei Tübingen, Nonnengasse 19, Tübingen", description: "Im Rahmen der Europäischen Woche der Abfallvermeidung bietet die Stadtbücherei Tübingen eine besondere Mitmachaktion an: An einem Papierbindetisch können aus einseitig bedrucktem Altpapier Spiralblöcke hergestellt werden. Papier ist vor Ort verfügbar, kann aber auch gerne mitgebracht werden." }, | |||
{ year: 2026, month: 11, day: 26, time: "Ganztägig", title: "Gemeinsam gegen Abfall – Papierrecycling in der Stadtbücherei", audience: "Familien", place: "Stadtbücherei Tübingen, Nonnengasse 19, Tübingen", description: "Im Rahmen der Europäischen Woche der Abfallvermeidung bietet die Stadtbücherei Tübingen eine besondere Mitmachaktion an: An einem Papierbindetisch können aus einseitig bedrucktem Altpapier Spiralblöcke hergestellt werden. Papier ist vor Ort verfügbar, kann aber auch gerne mitgebracht werden." } | |||
]; | |||
/* | |||
===================================================== | |||
AB HIER NICHTS MEHR ÄNDERN (außer bei Bedarf) | |||
===================================================== | |||
*/ | |||
const monthNames = { 10: "Oktober", 11: "November", 12: "Dezember" }; | |||
const weekdayNames = ["Mo", "Di", "Mi", "Do", "Fr", "Sa", "So"]; | |||
function getDaysInMonth(year, month) { | |||
return new Date(year, month, 0).getDate(); | |||
} | |||
function getWeekday(year, month, day) { | |||
const date = new Date(year, month - 1, day); | |||
let wd = date.getDay(); // 0 = Sonntag | |||
return wd === 0 ? 6 : wd - 1; // 0 = Montag | |||
} | |||
function escapeHtml(str) { | |||
return str | |||
.replace(/&/g, "&") | |||
.replace(/</g, "<") | |||
.replace(/>/g, ">") | |||
.replace(/"/g, """); | |||
} | |||
function renderCalendar() { | |||
const container = document.getElementById("calendar"); | |||
const monthsToRender = [10, 11, 12]; | |||
monthsToRender.forEach(month => { | |||
const monthEvents = events.filter(e => e.month === month && e.year === 2026); | |||
if (monthEvents.length === 0) return; | |||
const section = document.createElement("section"); | |||
section.className = "month"; | |||
section.setAttribute("aria-labelledby", `month-${month}`); | |||
const heading = document.createElement("h2"); | |||
heading.id = `month-${month}`; | |||
heading.textContent = `${monthNames[month]} 2026`; | |||
section.appendChild(heading); | |||
const weekdays = document.createElement("div"); | |||
weekdays.className = "weekdays"; | |||
weekdays.setAttribute("aria-hidden", "true"); | |||
weekdayNames.forEach(name => { | |||
const div = document.createElement("div"); | |||
div.textContent = name; | |||
weekdays.appendChild(div); | |||
}); | |||
section.appendChild(weekdays); | |||
const grid = document.createElement("div"); | |||
grid.className = "grid"; | |||
const daysInMonth = getDaysInMonth(2026, month); | |||
const firstWeekday = getWeekday(2026, month, 1); | |||
// Leere Tage vor dem 1. des Monats | |||
for (let i = 0; i < firstWeekday; i++) { | |||
const prevDay = getDaysInMonth(2026, month - 1) - firstWeekday + 1 + i; | |||
const dayDiv = document.createElement("div"); | |||
dayDiv.className = "day muted"; | |||
const dn = document.createElement("div"); | |||
dn.className = "dn"; | |||
dn.textContent = prevDay; | |||
dayDiv.appendChild(dn); | |||
grid.appendChild(dayDiv); | |||
} | |||
// Eigentliche Tage | |||
for (let day = 1; day <= daysInMonth; day++) { | |||
const dayEvents = monthEvents.filter(e => e.day === day); | |||
const dayDiv = document.createElement("div"); | |||
dayDiv.className = "day"; | |||
if (dayEvents.length > 0) dayDiv.classList.add("has-events"); | |||
const dn = document.createElement("div"); | |||
dn.className = "dn"; | |||
dn.textContent = day; | |||
dayDiv.appendChild(dn); | |||
dayEvents.forEach(ev => { | |||
const btn = document.createElement("button"); | |||
btn.type = "button"; | |||
btn.className = "event"; | |||
btn.setAttribute("data-date", `${day}. ${monthNames[month]} 2026`); | |||
btn.setAttribute("data-time", ev.time); | |||
btn.setAttribute("data-audience", ev.audience); | |||
btn.setAttribute("data-place", ev.place); | |||
btn.setAttribute("data-description", ev.description); | |||
if (ev.link) btn.setAttribute("data-link", ev.link); | |||
const timeSpan = document.createElement("span"); | |||
timeSpan.className = "event-time"; | |||
timeSpan.textContent = ev.time; | |||
const titleSpan = document.createElement("span"); | |||
titleSpan.className = "et"; | |||
titleSpan.textContent = ev.title; | |||
btn.appendChild(timeSpan); | |||
btn.appendChild(titleSpan); | |||
dayDiv.appendChild(btn); | |||
}); | |||
grid.appendChild(dayDiv); | |||
} | |||
// Leere Tage nach dem letzten Tag des Monats (auffüllen auf volle Wochen) | |||
const totalCells = firstWeekday + daysInMonth; | |||
const remaining = (7 - (totalCells % 7)) % 7; | |||
for (let i = 1; i <= remaining; i++) { | |||
const dayDiv = document.createElement("div"); | |||
dayDiv.className = "day muted"; | |||
const dn = document.createElement("div"); | |||
dn.className = "dn"; | |||
dn.textContent = i; | |||
dayDiv.appendChild(dn); | |||
grid.appendChild(dayDiv); | |||
} | |||
section.appendChild(grid); | |||
container.appendChild(section); | |||
}); | |||
} | |||
// Dialog-Logik | |||
(() => { | (() => { | ||
const dialog = document.getElementById("eventDialog"); | const dialog = document.getElementById("eventDialog"); | ||
| Zeile 303: | Zeile 378: | ||
const link = document.getElementById("dialogLink"); | const link = document.getElementById("dialogLink"); | ||
document. | document.addEventListener("click", (event) => { | ||
event. | if (!event.target.classList.contains("event")) return; | ||
const btn = event.target; | |||
title.textContent = btn.querySelector(".et").textContent.trim(); | |||
date.textContent = btn.dataset.date || ""; | |||
time.textContent = btn.dataset.time || "Nicht angegeben"; | |||
audience.textContent = btn.dataset.audience || "Nicht angegeben"; | |||
place.textContent = btn.dataset.place || "Nicht angegeben"; | |||
description.textContent = btn.dataset.description || "Keine Beschreibung vorhanden."; | |||
const url = btn.dataset.link; | |||
if (url) { | |||
linkRow.hidden = false; | |||
link.href = url; | |||
link.textContent = url.startsWith("mailto:") ? url.replace("mailto:", "") : url; | |||
link.target = url.startsWith("mailto:") ? "_self" : "_blank"; | |||
} else { | |||
linkRow.hidden = true; | |||
link.removeAttribute("href"); | |||
link.textContent = ""; | |||
} | |||
dialog.showModal(); | |||
}); | }); | ||
| Zeile 333: | Zeile 408: | ||
}); | }); | ||
})(); | })(); | ||
// Kalender beim Laden rendern | |||
renderCalendar(); | |||
</script> | </script> | ||
</body> | </body> | ||
</html> | </html> | ||
Aktuelle Version vom 7. September 2026, 12:25 Uhr
<!doctype html>
Viele Formen von Familie
Hier findet ihr eine Übersicht über das gesamte Programm zur Ausstellung. Die Ausstellung ist von Anfang Oktober bis Dezember 2026 in der Hauptstelle der Stadtbibliothek (Kinder- und Jugendbereich sowie 1. Stock) und im Stadtmuseum zu sehen.
In Kl&ruml;rung: Kino – drei Sonntagsmatineen mit Familienfilmen.