Familienangebote im August: Unterschied zwischen den Versionen

Aus Bündnis für Familie Tübingen.
Keine Bearbeitungszusammenfassung
Markierung: Zurückgesetzt
Keine Bearbeitungszusammenfassung
Markierung: Manuelle Zurücksetzung
Zeile 1: Zeile 1:
<html lang="de">
<head>
<meta charset="UTF-8">
<title>Familienangebote August 2026</title>
<style>
body {
    font-family: Arial, sans-serif;
    margin: 20px;
}
h2 {
    text-align: center;
}
.calendar {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 8px;
}
.weekday {
    font-weight: bold;
    text-align: center;
    padding: 10px;
    background: #f0f0f0;
}
.day {
    border: 1px solid #ccc;
    min-height: 120px;
    padding: 8px;
    cursor: pointer;
    background: #fff;
    transition: 0.2s;
}
.day:hover {
    background: #f8f8f8;
}
.day-number {
    font-weight: bold;
    margin-bottom: 5px;
}
.note {
    font-size: 13px;
    white-space: pre-wrap;
}
</style>
</head>
<body>
<h2>Familienangebote – August 2026</h2>
<div class="calendar" id="calendar"></div>
<script>
const calendar = document.getElementById("calendar");
const calendar = document.getElementById("calendar");


const weekdays = ["Mo","Di","Mi","Do","Fr","Sa","So"];
const weekdays = [
    "Mo","Di","Mi","Do","Fr","Sa","So"
];


weekdays.forEach(day => {
weekdays.forEach(day => {
Zeile 10: Zeile 72:
});
});


// August 2026 beginnt am Samstag
// August 2026 beginnt an einem Samstag
const firstDayOffset = 5;
const firstDayOffset = 5;


// Leere Felder vor dem 1. August
for(let i = 0; i < firstDayOffset; i++){
for(let i = 0; i < firstDayOffset; i++){
     const empty = document.createElement("div");
     const empty = document.createElement("div");
Zeile 18: Zeile 81:
}
}


// Tage erzeugen
for(let day = 1; day <= 31; day++) {
for(let day = 1; day <= 31; day++) {
    const key = "august2026_" + day;
    let data = {
        was: "",
        wann: "",
        zielgruppe: "",
        wo: "",
        anmeldung: "",
        link: ""
    };
    const saved = localStorage.getItem(key);
    if(saved){
        data = JSON.parse(saved);
    }


     const cell = document.createElement("div");
     const cell = document.createElement("div");
     cell.className = "day";
     cell.className = "day";


     renderCell();
     const key = "august2026_" + day;
    const savedText = localStorage.getItem(key) || "";
 
    cell.innerHTML = `
        <div class="day-number">${day}</div>
        <div class="note">${savedText}</div>
    `;


     cell.addEventListener("click", () => {
     cell.addEventListener("click", () => {
        const current = localStorage.getItem(key) || "";
        const text = prompt(
            "Eintrag für den " + day + ". August 2026:",
            current
        );


        const was = prompt("Was?", data.was);
         if(text !== null) {
         if(was === null) return;
            localStorage.setItem(key, text);
 
            cell.querySelector(".note").textContent = text;
        const wann = prompt("Wann?", data.wann);
         }
        if(wann === null) return;
 
        const zielgruppe = prompt("Zielgruppe?", data.zielgruppe);
        if(zielgruppe === null) return;
 
        const wo = prompt("Wo?", data.wo);
        if(wo === null) return;
 
        const anmeldung = prompt("Anmeldung?", data.anmeldung);
        if(anmeldung === null) return;
 
        const link = prompt("Link?", data.link);
        if(link === null) return;
 
        data = {
            was,
            wann,
            zielgruppe,
            wo,
            anmeldung,
            link
         };
 
        localStorage.setItem(key, JSON.stringify(data));
        renderCell();
     });
     });
    function renderCell() {
        cell.innerHTML = `
            <div class="day-number">${day}</div>
            <div class="note">
                ${data.was ? `<strong>Was:</strong> ${data.was}<br>` : ""}
                ${data.wann ? `<strong>Wann:</strong> ${data.wann}<br>` : ""}
                ${data.zielgruppe ? `<strong>Zielgruppe:</strong> ${data.zielgruppe}<br>` : ""}
                ${data.wo ? `<strong>Wo:</strong> ${data.wo}<br>` : ""}
                ${data.anmeldung ? `<strong>Anmeldung:</strong> ${data.anmeldung}<br>` : ""}
                ${data.link ? `<strong>Link:</strong> <a href="${data.link}" target="_blank">Öffnen</a>` : ""}
            </div>
        `;
    }


     calendar.appendChild(cell);
     calendar.appendChild(cell);
}
}
</script>
</body>
</html>

Version vom 9. Juni 2026, 09:23 Uhr

Familienangebote August 2026

Familienangebote – August 2026

Abgerufen von „https://www.buendnis-fuer-familie-tuebingen.de/mediawiki/index.php?title=Familienangebote_im_August&oldid=8340“