Schließt Issue #3 ("Übersichtlicher Gestalten"). Karte, Ausflugsziele
und Filter stehen ab 1024px jetzt in einer Zeile nebeneinander statt
Filter über der Liste. Filter & Suche bleibt über das native
<details>-Element auf-/zuklappbar, die Zwangs-Offen-Regel für Desktop
entfällt dafür.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Alle sieben Aktions-Buttons (Standort, Ausflugsziel anlegen,
KI-Prompt-Generator, Import, Backup) lagen bislang als absolut
positionierte Toolbar oben links ueber der Karte - direkt dort, wo
Leaflet standardmaessig seinen Zoom-Regler platziert, wodurch sich
beides ueberschnitt. Auf dem Smartphone nahm die Toolbar zudem viel
Platz auf der Karte weg.
Die Buttons sind jetzt in einem aufklappbaren Hamburger-Menue im Header
(js/main.js: setupMenuToggle(), schliesst bei Aktion/Escape/Klick
ausserhalb) statt direkt auf der Karte. Der Zoom-Regler wurde zusaetzlich
auf oben rechts verschoben (js/map/mapController.js), damit oben links
dauerhaft Platz fuer eigene Overlays (z.B. map-picking-hint) bleibt.
App-Shell auf Flexbox umgestellt (body als Flex-Spalte, .app-layout mit
flex:1) statt des bisherigen calc(100vh - fixe Header-Hoehe) auf
Desktop, da der Header jetzt bei geoeffnetem Menue waechst - die alte
fixe Berechnung haette Karte/Liste dabei abgeschnitten. --header-height
war dadurch ueberfluessig und wurde entfernt.
Neues Modul js/filters/ mit reiner Filterlogik (filterEngine.js:
applyFilters(), getDistanceKm()) und UI (filterPanel.js) fuer alle Filter
aus anforderung.md Abschnitt 3: Kategorie, Entfernung (mit "Standort
verwenden"-Button), Alter der Kinder, Kosten, Indoor/Outdoor, 5
Ausstattungsmerkmale, Aufenthaltsdauer, Mindestbewertung sowie
Freitextsuche ueber Name/Ort/Region/Adresse. Trefferzaehler, "Filter
zuruecksetzen" und "Auf Ergebnisse zoomen" ergaenzt.
Store erweitert um updateFilters()/getFilteredPlaces() (Selector).
Karte und Liste rendern jetzt die gefilterte statt die volle
Ausflugsziel-Liste; die Karten-Rerender-Optimierung vergleicht dafuer
die Trefferliste per Id-Schluessel statt nur state.places, damit reine
Filter-/Standortaenderungen ohne Places-Aenderung erkannt werden.
Layout: Filter-Panel als aufklappbares <details> auf Mobile, eigener
Grid-Bereich neben der Karte auf Desktop. docs/plan.md entsprechend
fortgeschrieben (Phase 2-5 als umgesetzt markiert, Phase 5
Navigation war bereits Teil von Phase 2).
Reines HTML5/CSS3/JavaScript ohne Build-Tooling, lauffaehig direkt per
Doppelklick auf index.html (file://, kein Server noetig):
- Datenmodell fuer Ausflugsziele mit allen Feldern aus der Anforderung,
15 feste Kategorien inkl. Farbe/Icon
- Zentraler Pub/Sub-Store mit LocalStorage-Persistenz und
Migrations-Grundgeruest
- Interaktive Karte (Leaflet + Leaflet.markercluster, lokal vendored)
mit kategoriefarbenen Markern, Clustering, Popups, Geolocation-Button
- Kartengrundlage ueber CARTO-Basemaps statt tile.openstreetmap.org, da
dessen Referer-Pflicht file://-Aufrufe blockiert
- Seed-Daten als eingebettetes Script (data/seed.js) statt JSON-Datei,
da fetch() auf lokale Dateien unter file:// nicht zuverlaessig
funktioniert
- Ergebnisliste mit 10 Beispiel-Ausflugszielen, sicher gerendert ueber
textContent/DOM-APIs statt innerHTML (Vorbereitung fuer spaeteren
KI-JSON-Import mit Fremddaten)
- Responsives Layout (Desktop nebeneinander, Mobile gestapelt)
dapelzaandClaude Sonnet 5