From 5774b22f114674764b8b8b9837eddeb3b8b37f89 Mon Sep 17 00:00:00 2001 From: Pascal Date: Thu, 6 Aug 2026 12:40:33 +0000 Subject: [PATCH] Finales Redesign: graue Light-Variante als Website, neue Subpages (Veranstaltungen, Kontakt), Bilder & Logos eingebunden, Altlasten entfernt --- README.md | 108 +-- .../grau/assets => assets}/components.js | 24 +- .../grau/assets/grau.css => assets/style.css | 76 +- css/acc.css | 20 - css/carousel.css | 35 - css/footer.css | 10 - css/nav.css | 128 ---- {varianten/shared => data}/dienste.js | 18 + {varianten/shared => data}/fahrzeuge.js | 0 {varianten/shared => data}/geschichte.js | 0 {varianten/shared => data}/mitglieder.js | 0 .../grau/dienstplan.html => dienstplan.html | 7 +- dienstplan/dienst.html | 24 - dienstplan/dienstplan.js | 48 -- varianten/grau/fahrzeug.html => fahrzeug.html | 7 +- ffw_transp_72.gif | Bin 9031 -> 0 bytes .../grau/geschichte.html => geschichte.html | 7 +- geschichte/Geschichte.html | 333 --------- index.html | 342 +++------ index_old.html | 177 ----- kontakt.html | 93 +++ .../grau/mitglieder.html => mitglieder.html | 7 +- mitglieder/Organigramm.html | 239 ------- varianten/grau/technik.html => technik.html | 7 +- technik/Hydrantenwagen/Hydrantenwagen.html | 222 ------ technik/TSA-Anhaenger/TSA.html | 240 ------- .../Transporthaenger/Transporthaenger.html | 209 ------ technik/VRW-Quad/VRW.html | 228 ------ technik/bildertechnik.css | 4 - technik/lf1/lf1.html | 202 ------ technik/lf10/lf10.html | 239 ------- technik/rtb1/rtb1.html | 237 ------- .../rtb1schlauchboot/rtb1_Schlauchboot.html | 202 ------ technik/rtb2/rtb2.html | 225 ------ technik/sta/sta.html | 229 ------ technik/technik.html | 351 ---------- technik/tsf/tsf.html | 255 ------- varianten/grau/index.html | 84 --- varianten/rot/assets/components.js | 266 ------- varianten/rot/assets/rot.css | 650 ------------------ varianten/rot/dienstplan.html | 64 -- varianten/rot/geschichte.html | 46 -- varianten/rot/index.html | 76 -- varianten/rot/mitglieder.html | 46 -- varianten/rot/technik.html | 46 -- .../rot/fahrzeug.html => veranstaltungen.html | 23 +- 46 files changed, 374 insertions(+), 5480 deletions(-) rename {varianten/grau/assets => assets}/components.js (94%) rename varianten/grau/assets/grau.css => assets/style.css (89%) delete mode 100755 css/acc.css delete mode 100755 css/carousel.css delete mode 100644 css/footer.css delete mode 100755 css/nav.css rename {varianten/shared => data}/dienste.js (79%) rename {varianten/shared => data}/fahrzeuge.js (100%) rename {varianten/shared => data}/geschichte.js (100%) rename {varianten/shared => data}/mitglieder.js (100%) rename varianten/grau/dienstplan.html => dienstplan.html (90%) delete mode 100644 dienstplan/dienst.html delete mode 100644 dienstplan/dienstplan.js rename varianten/grau/fahrzeug.html => fahrzeug.html (85%) delete mode 100755 ffw_transp_72.gif rename varianten/grau/geschichte.html => geschichte.html (86%) delete mode 100755 geschichte/Geschichte.html delete mode 100755 index_old.html create mode 100644 kontakt.html rename varianten/grau/mitglieder.html => mitglieder.html (85%) delete mode 100644 mitglieder/Organigramm.html rename varianten/grau/technik.html => technik.html (85%) delete mode 100644 technik/Hydrantenwagen/Hydrantenwagen.html delete mode 100644 technik/TSA-Anhaenger/TSA.html delete mode 100644 technik/Transporthaenger/Transporthaenger.html delete mode 100644 technik/VRW-Quad/VRW.html delete mode 100755 technik/bildertechnik.css delete mode 100644 technik/lf1/lf1.html delete mode 100755 technik/lf10/lf10.html delete mode 100644 technik/rtb1/rtb1.html delete mode 100644 technik/rtb1schlauchboot/rtb1_Schlauchboot.html delete mode 100644 technik/rtb2/rtb2.html delete mode 100644 technik/sta/sta.html delete mode 100755 technik/technik.html delete mode 100644 technik/tsf/tsf.html delete mode 100644 varianten/grau/index.html delete mode 100644 varianten/rot/assets/components.js delete mode 100644 varianten/rot/assets/rot.css delete mode 100644 varianten/rot/dienstplan.html delete mode 100644 varianten/rot/geschichte.html delete mode 100644 varianten/rot/index.html delete mode 100644 varianten/rot/mitglieder.html delete mode 100644 varianten/rot/technik.html rename varianten/rot/fahrzeug.html => veranstaltungen.html (52%) diff --git a/README.md b/README.md index 86cec52..a4d9ae0 100644 --- a/README.md +++ b/README.md @@ -1,73 +1,75 @@ # Feuerwehr Stadt Wehlen – Webseite -## Zwei komplette Design-Varianten (Redesign) +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). -Die Seite existiert in zwei vollständig eigenständigen Designs mit -identischem Inhalt – zum Vergleich und zur Entscheidungsfindung: +## Seiten -| Variante | Pfad | Design | -|---|---|---| -| **Rot** | `varianten/rot/` | Dark Theme: schwarz-roter Hintergrund, gelbe Akzente, kantige Shapes, große Hero-Sektion, Zeitleisten-Tabs | -| **Grau** | `varianten/grau/` | Light Theme: hellgrauer Hintergrund, weiße abgerundete Karten, roter Header mit Logo-Muster, Accordion, Kategorie-Filter | - -Jede Variante umfasst 6 Seiten: -`index.html` (Start), `geschichte.html`, `technik.html`, -`fahrzeug.html` (Detailseite, datengetrieben via `?id=lf10` usw.), -`mitglieder.html` (Organigramm), `dienstplan.html`. +| 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 ``` -varianten/ - shared/ ZENTRALE DATENQUELLEN (für beide Designs) - fahrzeuge.js Alle Fahrzeuge/Boote/Anhänger inkl. Technikdaten - geschichte.js Alle 5 Geschichts-Epochen - mitglieder.js Organigramm & Mitgliederlisten - dienste.js CSV-Logik für Dienstplan & Termine - rot/ - index.html, geschichte.html, technik.html, - fahrzeug.html, mitglieder.html, dienstplan.html - assets/ - rot.css Komplettes Dark-Theme - components.js Navbar, Footer, Hero + alle Renderer - grau/ - (gleiche 6 Seiten) - assets/ - grau.css Komplettes Light-Theme - components.js Navbar, Footer, Hero + alle Renderer +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 werden nur an EINER Stelle gepflegt**: in `varianten/shared/` - (bzw. `dienstplan/dienstplan.csv` für Termine). Beide Designs rendern - daraus ihr eigenes Markup. -- Navbar, Footer und Hero liegen je Variante zentral in - `assets/components.js` und werden in die Platzhalter - `#site-header`, `#site-footer`, `#site-hero` eingefügt. -- Jede Seite setzt `window.FFW_BASE = "../../"` (Pfad zum Projekt-Root), - damit Bilder und die CSV auch aus den Unterordnern gefunden werden. +- 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 | `dienstplan/dienstplan.csv` | -| Fahrzeugdaten, Bilder, Beladung | `varianten/shared/fahrzeuge.js` | -| Geschichtstexte | `varianten/shared/geschichte.js` | -| Mitglieder / Organigramm | `varianten/shared/mitglieder.js` | -| Menü / Footer | `varianten/{rot,grau}/assets/components.js` | -| Farben eines Designs | `varianten/{rot,grau}/assets/*.css` (`:root`-Variablen) | +| 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) | -## Hinweise +## Offene TODOs -- Zum lokalen Ansehen einen Server starten (wegen CSV-Fetch): - `python3 -m http.server 8000`, dann - `http://localhost:8000/varianten/rot/` bzw. `.../grau/` öffnen. -- Der ELW 1 hat aktuell keine Detailseite – die Karte ist mit - „Demnächst“ markiert (`inArbeit: true` in `fahrzeuge.js`). -- `index.html` / `index_old.html` im Root sowie die Ordner `geschichte/`, - `technik/`, `mitglieder/` enthalten den ALTEN Stand und können nach - der Design-Entscheidung entfernt werden (die Bilder darin werden vom - Redesign weiterverwendet – vorher Bilder umziehen!). +- 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. diff --git a/varianten/grau/assets/components.js b/assets/components.js similarity index 94% rename from varianten/grau/assets/components.js rename to assets/components.js index d05e0a7..488646f 100644 --- a/varianten/grau/assets/components.js +++ b/assets/components.js @@ -1,8 +1,8 @@ /* ====================================================== - components.js – VARIANTE GRAU (Modern Light Theme) + components.js – Feuerwehr Stadt Wehlen (Modern Light) ------------------------------------------------------ Rendert alle wiederkehrenden Elemente und die Inhalte - aus den zentralen Daten-Dateien (varianten/shared/). + aus den zentralen Daten-Dateien (data/). Erwartet window.FFW_BASE (Pfad zum Projekt-Root). Aktiver Navigationspunkt über . @@ -39,8 +39,8 @@
  • Dienstplan
    • -
  • Veranstaltungen
    • -
  • Kontakt / Impressum
    • +
  • Veranstaltungen
    • +
  • Kontakt / Impressum
    • @@ -49,23 +49,31 @@ const FOOTER = `