From 1f3e60efde715939e24885a5a75b4406fa39ae3e Mon Sep 17 00:00:00 2001
From: marwin <medczinski.marw@gmail.com>
Date: Fri, 2 May 2025 09:04:48 +0100
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat:=20update=20index.html=20templ?=
 =?UTF-8?q?ate=20for=20improved=20layout=20and=20accessibility?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 templates/index.html | 42 ++++++++++++++++++++++++++++++++----------
 1 file changed, 32 insertions(+), 10 deletions(-)

diff --git a/templates/index.html b/templates/index.html
index 5a7f0ae..7309232 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -39,6 +39,35 @@
     animation: textReveal 1s cubic-bezier(0.77, 0, 0.18, 1) forwards;
   }
   
+  /* Marker-Animation für den Text */
+  @keyframes markerAnimation {
+    0% { width: 0; opacity: 0; }
+    20% { width: 100%; opacity: 0.7; }
+    80% { width: 100%; opacity: 0.7; }
+    100% { width: 0; opacity: 0; }
+  }
+  
+  .marker-animation {
+    position: relative;
+  }
+  
+  .marker-animation::after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    height: 6px;
+    width: 0;
+    background: linear-gradient(to right, rgba(109, 40, 217, 0.3), rgba(139, 92, 246, 0.6), rgba(109, 40, 217, 0.3));
+    border-radius: 3px;
+    opacity: 0;
+    animation: markerAnimation 2.5s ease-in-out forwards;
+  }
+  
+  .marker-animation-delay::after {
+    animation-delay: 1.5s;
+  }
+  
   .delay-1 { animation-delay: 0.2s; }
   .delay-2 { animation-delay: 0.4s; }
   .delay-3 { animation-delay: 0.6s; }
@@ -131,16 +160,9 @@
   <div class="max-w-screen-xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
     <div class="text-center mb-16">
       <h1 class="hero-heading mb-8 text-gray-900 dark:text-white">
-        <div class="overflow-hidden">
-          <span class="gradient-text inline-block text-reveal">Wissen</span>
-        </div>
-        <div class="overflow-hidden mt-2">
-          <span class="inline-block text-reveal delay-1">neu</span>
-        </div>
-        <div class="mt-2 relative overflow-hidden">
-          <span class="relative inline-block text-reveal delay-2">vernetzen
-            <div class="absolute -bottom-2 left-0 right-0 h-1 bg-gradient-to-r from-purple-500/0 via-purple-500/70 to-purple-500/0 rounded-full"></div>
-          </span>
+        <div class="overflow-hidden flex justify-center gap-6">
+          <span class="relative inline-block text-reveal marker-animation">Wissen.</span>
+          <span class="relative inline-block text-reveal delay-1 marker-animation marker-animation-delay">Vernetzen.</span>
         </div>
       </h1>
       <div class="overflow-hidden">