Updated animation

src/App.jsx

@@ -21,15 +21,6 @@ function isSnowfallSeason(date = DateTime.now()) {
     return date <= prevEnd;
 }
 
-// Gibt alle 10 Sekunden einen anderen Boolean zurück, basierend auf der aktuellen Sekunde
-function isTenSecondInterval() {
-    const seconds = DateTime.now().second;
-    // true für 0-9, 20-29, 40-49; false sonst
-    return (seconds >= 0 && seconds < 10) || (seconds >= 20 && seconds < 30) || (seconds >= 40 && seconds < 50);
-}
-
-
-
 export default function LiquidDevelopment() {
     return (
         <div
@@ -43,7 +34,7 @@ export default function LiquidDevelopment() {
                 pointerEvents: 'none',
                 zIndex: 9999,
             }}>
-                {isTenSecondInterval() && <Snowfall snowflakeCount={80} />}
+                {isSnowfallSeason() && <Snowfall snowflakeCount={80} />}
             </div>
 
             <Navbar/>

src/sections/Hero.jsx

@@ -1,10 +1,10 @@
 import React from 'react';
-import { motion } from 'framer-motion';
+import {motion} from 'framer-motion';
-import { ArrowRight } from 'lucide-react';
+import {ArrowRight} from 'lucide-react';
-import { BrandLogo } from '../components/BrandLogo';
+import {BrandLogo} from '../components/BrandLogo';
-import { Bubbles } from '../components/Bubbles';
+import {Bubbles} from '../components/Bubbles';
-import { ObfuscatedMail } from '../components/ObfuscatedMail';
+import {ObfuscatedMail} from '../components/ObfuscatedMail';
-import { SOCIALS } from '../data/content';
+import {SOCIALS} from '../data/content';
 
 export const Hero = () => {
     const emailSocial = SOCIALS.find(s => !s.link.startsWith('http'));
@@ -23,49 +23,45 @@ export const Hero = () => {
                 }}
             />
 
-            <Bubbles />
+            <Bubbles/>
 
             <div className="relative z-10 text-center px-6 max-w-6xl mx-auto">
                 <motion.div
-                    initial={{ scale: 0.8, opacity: 0 }}
+                    initial={{scale: 0.5, opacity: 0}}
-                    animate={{ scale: 1, opacity: 1 }}
+                    animate={{scale: 1, opacity: 1}}
-                    transition={{ duration: 0.8 }}
+                    transition={{duration: 0.5}}
                     className="mx-auto mb-8 w-24 h-24 md:w-32 md:h-32 rounded-full bg-[#00A3FF]/5 flex items-center justify-center border border-[#00A3FF]/30 shadow-[0_0_60px_-10px_rgba(0,163,255,0.4)]"
                 >
-                    <BrandLogo className="w-14 h-14 md:w-20 md:h-20 text-[#00A3FF]" />
+                    <BrandLogo className="w-14 h-14 md:w-20 md:h-20 text-[#00A3FF]"/>
                 </motion.div>
 
                 <motion.div
-                    initial={{ y: 20, opacity: 0 }}
+                    initial={{y: 20, opacity: 0}}
-                    animate={{ y: 0, opacity: 1 }}
+                    animate={{y: 0, opacity: 1}}
-                    transition={{ delay: 0.2 }}
+                    transition={{delay: 0.2}}
                 >
                     <h1 className="text-4xl md:text-7xl font-extrabold tracking-tighter mb-6">
-                        <ObfuscatedMail
-                            email={rawEmail}
-                            className="cursor-pointer hover:opacity-80 transition-opacity duration-300 bg-transparent border-none p-0 font-extrabold tracking-tighter text-4xl md:text-7xl text-white"
-                        >
                         LIQUID
-                            <span className="ml-3 text-transparent bg-clip-text bg-gradient-to-r from-[#00A3FF] to-cyan-200">
+                        <span
+                            className="ml-3 text-transparent bg-clip-text bg-gradient-to-r from-[#00A3FF] to-cyan-200">
                                 DEVELOPMENT
                         </span>
-                        </ObfuscatedMail>
                     </h1>
                 </motion.div>
 
                 <motion.p
-                    initial={{ y: 20, opacity: 0 }}
+                    initial={{y: 20, opacity: 0}}
-                    animate={{ y: 0, opacity: 1 }}
+                    animate={{y: 0, opacity: 1}}
-                    transition={{ delay: 0.4 }}
+                    transition={{delay: 0.4}}
                     className="text-lg md:text-2xl text-gray-400 mb-10 max-w-2xl mx-auto font-light"
                 >
                     Open-source software development team
                 </motion.p>
 
                 <motion.div
-                    initial={{ y: 20, opacity: 0 }}
+                    initial={{y: 20, opacity: 0}}
-                    animate={{ y: 0, opacity: 1 }}
+                    animate={{y: 0, opacity: 1}}
-                    transition={{ delay: 0.6 }}
+                    transition={{delay: 0.6}}
                     className="flex flex-col sm:flex-row gap-6 justify-center items-center"
                 >
                     <a