Added scrolling text

src/components/sections/HeroSection.astro

@@ -18,6 +18,10 @@ const statusColor =
         yellow: "bg-warning",
         red: "bg-error",
     }[statusColorConfig] || "bg-success";
+
+const rotatingText = (siteConfig.hero as any).rotatingText as
+    | { text: string; className: string }[]
+    | undefined;
 ---
 
 <section class="relative overflow-hidden bg-neutral">
@@ -44,11 +48,32 @@ const statusColor =
 
             <h1
                 class="text-4xl sm:text-5xl lg:text-6xl xl:text-7xl font-extrabold text-white leading-tight tracking-tight mb-6"
-                set:html={siteConfig.hero.mainTitle.replace(
-                    "Digital Solutions",
-                    "Digital Solutions<br class='hidden sm:block' />",
-                )}
-            />
+            >
+                {
+                    siteConfig.hero.mainTitle
+                        .split("{rotating}")
+                        .map((part, index, array) => (
+                            <>
+                                {part}
+                                {index < array.length - 1 && rotatingText && (
+                                    <span class="block w-full my-2">
+                                        <span class="text-rotate">
+                                            <span class="justify-items-center">
+                                                {rotatingText.map((item) => (
+                                                    <span
+                                                        class={item.className}
+                                                    >
+                                                        {item.text}
+                                                    </span>
+                                                ))}
+                                            </span>
+                                        </span>
+                                    </span>
+                                )}
+                            </>
+                        ))
+                }
+            </h1>
 
             <p
                 class="text-lg sm:text-xl text-white/70 max-w-2xl mx-auto mb-10 leading-relaxed"