Add styling for maps info window

The background-color of the info window is always white, so we have to use hard-coded values here.

diff --git a/ts/WoltLabSuite/Core/Component/GoogleMaps/MarkerLoader.ts b/ts/WoltLabSuite/Core/Component/GoogleMaps/MarkerLoader.ts
index 43815a2cbf4eaff316c072378587a0fb06d65d2a..ad44a2dab1487fd65db81823578d9b5b3e4f7a67 100644 (file)
--- a/ts/WoltLabSuite/Core/Component/GoogleMaps/MarkerLoader.ts
+++ b/ts/WoltLabSuite/Core/Component/GoogleMaps/MarkerLoader.ts
@@ -100,6 +100,7 @@ class MarkerLoader {
 
     if (data.infoWindow) {
       const content = document.createElement("div");
+      content.classList.add("googleMapsInfoWindow");
       DomUtil.setInnerHtml(content, data.infoWindow);
 
       const infoWindow = new google.maps.InfoWindow({

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/GoogleMaps/MarkerLoader.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/GoogleMaps/MarkerLoader.js
index 2d661f94ee307536ac1ad676c86d03ed7a25cbf8..be279050845a1acb63539dfe1155f71d9e5f85e1 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/GoogleMaps/MarkerLoader.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/GoogleMaps/MarkerLoader.js
@@ -66,6 +66,7 @@ define(["require", "exports", "tslib", "../../Ajax", "../Dialog", "../../Dom/Uti
             this.#clusterer.addMarker(marker);
             if (data.infoWindow) {
                 const content = document.createElement("div");
+                content.classList.add("googleMapsInfoWindow");
                 Util_1.default.setInnerHtml(content, data.infoWindow);
                 const infoWindow = new google.maps.InfoWindow({
                     headerContent: data.title,

diff --git a/wcfsetup/install/files/style/ui/googleMap.scss b/wcfsetup/install/files/style/ui/googleMap.scss
index 0a4a26a79c05ae336bdc2636b4ed2f1ed90b0860..b27f4e794e927e70294f55cf46c2e2c2042159bd 100644 (file)
--- a/wcfsetup/install/files/style/ui/googleMap.scss
+++ b/wcfsetup/install/files/style/ui/googleMap.scss
@@ -64,3 +64,12 @@
        margin-top: 5px;
        text-align: right;
 }
+
+.googleMapsInfoWindow {
+       color: #333;
+
+       a,
+       a:hover {
+               color: #369;
+       }
+}