Compare commits

...

2 Commits

2 changed files with 34 additions and 12 deletions

View File

@@ -18,11 +18,11 @@ class NeuralNetworkBackground {
// Standardkonfiguration mit subtileren Werten
this.config = {
nodeCount: 50, // Weniger Knoten
nodeCount: 30, // Weniger Knoten
nodeSize: 1.2, // Kleinere Knoten
connectionDistance: 150, // Reduzierte Verbindungsdistanz
connectionOpacity: 0.3, // Sanftere Verbindungslinien
clusterCount: 2, // Weniger Cluster
clusterCount: 6, // Weniger Cluster
clusterRadius: 380, // Größerer Cluster-Radius für mehr Verteilung
animationSpeed: 0.25, // Langsamere Animation
flowDensity: 0.05, // Deutlich weniger Flussanimationen

View File

@@ -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">