Phase 2: Detailansicht

Modal, das sich bei Marker- oder Listen-Auswahl (state.selectedPlaceId) oeffnet: Titelbild/Platzhalter, vollstaendige Beschreibung, Adresse, Mini-Karte mit Positionsmarker, Oeffnungszeiten, Kosten, Altersempfehlung, Ausstattung (inkl. klar markierter negativer Werte), Hinweise fuer Familien, Website-Link. Navigation-Button zu OSM Directions. Loeschen ist bereits voll funktional (mit Bestaetigung), Bearbeiten ist als Platzhalter fuer Phase 3 markiert. Neuer Helper isSafeHttpUrl() in dom.js: nur http/https als Link- oder Bildquelle zulaessig, schuetzt vor javascript:-URLs in Fremddaten (Vorbereitung fuer KI-JSON-Import). Rendering weiterhin ausschliesslich ueber textContent/el(), kein innerHTML mit Place-Daten.
2026-07-24 11:32:32 +02:00
parent ee55fb1cf9
commit 2812e03530
6 changed files with 707 additions and 1 deletions
@@ -13,6 +13,7 @@
  <link rel="stylesheet" href="css/variables.css" />
  <link rel="stylesheet" href="css/layout.css" />
  <link rel="stylesheet" href="css/components.css" />
+  <link rel="stylesheet" href="css/detail.css" />
  <link rel="stylesheet" href="css/responsive.css" />
 </head>
 <body>
@@ -43,6 +44,8 @@
    </aside>
  </main>

+  <div id="detail-modal" class="detail-modal" hidden></div>
+
  <script src="vendor/leaflet/leaflet.js"></script>
  <script src="vendor/leaflet.markercluster/leaflet.markercluster.js"></script>

@@ -65,6 +68,7 @@
  <script src="js/map/markers.js"></script>
  <script src="js/map/mapController.js"></script>
  <script src="js/ui/list.js"></script>
+  <script src="js/ui/detail.js"></script>
  <script src="js/main.js"></script>
 </body>
 </html>