feat(poi): Mouseover-Tooltip für POIs mit Tailwind-Styling ersetzt Popup
- bindPopup entfernt und durch bindTooltip ersetzt - Tooltip zeigt POI-Details bei Hover - Tailwind-Klassen sorgen für einheitliches Design (rund, schatten, padding) - Version auf 1.1.177 erhöht
This commit is contained in:
28
CHANGELOG.md
28
CHANGELOG.md
@@ -4,6 +4,34 @@ Alle bedeutenden Änderungen an diesem Projekt werden in dieser Datei dokumentie
|
||||
|
||||
---
|
||||
|
||||
[1.1.177] – 2025-05-26
|
||||
✨ UI-Verbesserung
|
||||
POI-Tooltip auf der Karte wird jetzt bei Mouseover angezeigt (nicht mehr per Klick).
|
||||
|
||||
Tooltip ist einheitlich gestaltet mit Tailwind CSS:
|
||||
|
||||
Abgerundete Ecken (rounded-xl)
|
||||
|
||||
Schatten (shadow-lg)
|
||||
|
||||
Innenabstände (px-4 py-2)
|
||||
|
||||
Blaue Überschrift, graue Beschriftung
|
||||
|
||||
Einheitlicher Stil für alle Marker-Tooltips (setupPOIs.js angepasst).
|
||||
|
||||
✅ Clean
|
||||
Alte bindPopup()-Logik entfernt – kein manuelles Öffnen/Schließen mehr nötig
|
||||
|
||||
closePopup() aus mouseout-Handler entfernt
|
||||
|
||||
Tooltip verwendet sticky: true, folgt der Maus
|
||||
|
||||
🔧 Version
|
||||
📦 Version erhöht auf 1.1.177
|
||||
|
||||
---
|
||||
|
||||
[1.1.176] – 2025-05-26
|
||||
🐞 Fixed
|
||||
Problem behoben, dass das Modal „POI hinzufügen“ nach erfolgreichem Submit nicht geschlossen wurde und die Meldung „Wird hinzugefügt…“ dauerhaft sichtbar blieb.
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
// /config/appVersion
|
||||
export const APP_VERSION = "1.1.177";
|
||||
export const APP_VERSION = "1.1.178";
|
||||
|
||||
@@ -78,13 +78,21 @@ export const setupPOIs = async (
|
||||
});
|
||||
}
|
||||
|
||||
marker.bindPopup(`
|
||||
<div>
|
||||
<b class="text-xl text-black-700">${poi.description || "Unbekannt"}</b><br>
|
||||
${deviceName || "unbekannt"} <br>
|
||||
${poiTypName}<br>
|
||||
marker.bindTooltip(
|
||||
`
|
||||
<div class="bg-white text-gray-800 text-sm rounded-xl px-4 py-2 w-56">
|
||||
<div class="font-semibold text-blue-500 mb-1">${poi.description || "Unbekannt"}</div>
|
||||
<div class="text-gray-600 text-sm">Gerät: ${deviceName || "unbekannt"}</div>
|
||||
<div class="text-gray-600 text-sm">Typ: ${poiTypName}</div>
|
||||
</div>
|
||||
`);
|
||||
`,
|
||||
{
|
||||
direction: "top",
|
||||
offset: [0, -10],
|
||||
opacity: 0.95,
|
||||
sticky: true,
|
||||
}
|
||||
);
|
||||
|
||||
marker.on("mouseover", function () {
|
||||
dispatch(setSelectedPoi(poi));
|
||||
@@ -94,7 +102,7 @@ export const setupPOIs = async (
|
||||
|
||||
marker.on("mouseout", function () {
|
||||
dispatch(clearSelectedPoi());
|
||||
this.closePopup();
|
||||
//this.closePopup();
|
||||
});
|
||||
|
||||
marker.on("dragend", (e) => {
|
||||
|
||||
Reference in New Issue
Block a user