# Feuerwehr Stadt Wehlen – Webseite Modernes Redesign im hellen „Modern Light"-Design: hellgrauer Hintergrund, weiße abgerundete Karten, roter Header mit Logo-Muster. Vollständig mobile-optimiert (responsives Grid, Hamburger-Menü, Karten statt Tabellen auf dem Smartphone). ## Seiten | Datei | Inhalt | |---|---| | `index.html` | Start: Hero, Gerätehaus, Termine, Schnellzugriff | | `geschichte.html` | Wehrgeschichte seit 1865 als Accordion (inkl. Zeitungsartikel 1921) | | `technik.html` | Fahrzeug-Übersicht mit Kategorie-Filter | | `fahrzeug.html` | Detailseite, datengetrieben via `?id=lf10` usw. | | `mitglieder.html` | Organigramm & Mitgliederlisten | | `dienstplan.html` | Nächste Termine + komplette Termintabelle | | `veranstaltungen.html` | Feste & Veranstaltungen (aus der CSV gefiltert) | | `kontakt.html` | Kontakt & Impressum | ## Struktur ``` assets/ style.css Komplettes Design (Farben in :root-Variablen) components.js Navbar, Footer, Hero + alle Renderer data/ ZENTRALE DATENQUELLEN – Inhalte nur HIER pflegen fahrzeuge.js Fahrzeuge/Boote/Anhänger inkl. Technikdaten & Bilder geschichte.js Geschichts-Epochen mitglieder.js Organigramm & Mitgliederlisten dienste.js Liest dienstplan/dienstplan.csv, befüllt alle Terminbereiche dienstplan/ dienstplan.csv Termine (einzige Quelle für Dienstplan & Veranstaltungen) bilder/, technik/, geschichte/ Bildmaterial ``` ## Prinzip - Inhalte liegen zentral in `data/` bzw. `dienstplan/dienstplan.csv` – die Seiten rendern daraus automatisch ihr Markup. - Navbar, Footer und Hero liegen in `assets/components.js` und werden in die Platzhalter `#site-header` / `#site-footer` / `#site-hero` eingefügt. - `window.FFW_BASE` (im `` jeder Seite) ist der Pfad zum Projekt-Root – bei Seiten im Root einfach `""`. - Der aktive Menüpunkt wird über `` gesteuert. ## Inhalte ändern | Was | Wo | |---|---| | Termine / Dienstplan / Veranstaltungen | `dienstplan/dienstplan.csv` | | Fahrzeugdaten, Bilder, Beladung | `data/fahrzeuge.js` | | Geschichtstexte | `data/geschichte.js` | | Mitglieder / Organigramm | `data/mitglieder.js` | | Menü / Footer / Hero | `assets/components.js` | | Farben | `assets/style.css` (`:root`-Variablen oben) | ## Offene TODOs - Kontaktdaten (Adresse, E-Mail) in `kontakt.html` ergänzen (mit `TODO`-Kommentaren markiert) - ELW 1: Detailseite fehlt noch – Karte ist als „Demnächst" markiert (`inArbeit: true` in `data/fahrzeuge.js`) ## Lokal ansehen ```sh python3 -m http.server 8000 # dann http://localhost:8000/ öffnen ``` ## Hinweis Die vorherigen Design-Entwürfe (rote Dark-Variante, alter Stand) sind in der Git-Historie erhalten.