coloring

frontend/src/lib/components/Pagebuilder/Homepage.svelte

@@ -27,25 +27,29 @@
             Object.assign(swiper, params)
             swiper.initialize()
 
-            // Add the 'active' class to the h1 of the first slide
-            const firstSlideH1 = document.querySelector(".swiper-slide-active .titles h1")
-            if (firstSlideH1) {
-                firstSlideH1.classList.add("active")
+            if (typeof window !== "undefined") {
+                // Add the 'active' class to the h1 of the first slide
+                const firstSlideH1 = document.querySelector(".swiper-slide-active .titles h1")
+                if (firstSlideH1) {
+                    firstSlideH1.classList.add("active")
+                }
             }
         }
     })
 
     function handleSlideChange() {
-        document.querySelectorAll(".titles h1").forEach((h1) => {
-            h1.classList.remove("active")
-        })
+        if (typeof window !== "undefined") {
+            document.querySelectorAll(".titles h1").forEach((h1) => {
+                h1.classList.remove("active")
+            })
 
-        setTimeout(() => {
-            const activeSlideUnderline = document.querySelector(".swiper-slide-active .titles h1")
-            if (activeSlideUnderline) {
-                activeSlideUnderline.classList.add("active")
-            }
-        }, 600)
+            setTimeout(() => {
+                const activeSlideUnderline = document.querySelector(".swiper-slide-active .titles h1")
+                if (activeSlideUnderline) {
+                    activeSlideUnderline.classList.add("active")
+                }
+            }, 600)
+        }
     }
     let teaser = teasers[0]
 </script>
@@ -135,6 +139,7 @@
                     line-height: 1;
                     font-weight: 500;
                     position: relative;
+                    color: @signal-color;
                 }
 
                 h2 {