view release on metacpan or  search on metacpan

docs/index.html  view on Meta::CPAN

    <meta name="description" content="GitKttiâ„¢ is a powerful collection of Perl scripts designed to simplify Git Flow workflow for developers">
    <link rel="icon" type="image/png" href="assets/gitktti_logo.png">
    <link rel="apple-touch-icon" href="assets/gitktti_logo.png">
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        @keyframes float {
            0% { transform: translateY(0px); }
            50% { transform: translateY(-20px); }
            100% { transform: translateY(0px); }
        }

        @keyframes glow {
            0% { box-shadow: 0 0 20px rgba(102, 126, 234, 0.4); }
            50% { box-shadow: 0 0 30px rgba(102, 126, 234, 0.8); }
            100% { box-shadow: 0 0 20px rgba(102, 126, 234, 0.4); }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(30px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes slideInLeft {
            from {
                opacity: 0;
                transform: translateX(-50px);
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }

        @keyframes slideInRight {
            from {
                opacity: 0;
                transform: translateX(50px);
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }

        @keyframes starfield {
            0% { transform: translateY(0) rotate(0deg); }
            100% { transform: translateY(-100vh) rotate(360deg); }
        }

        body {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            line-height: 1.6;
            color: #e0e0e0;
            background: #0a0a0a;
            min-height: 100vh;

docs/index.html  view on Meta::CPAN

        .shooting-star:nth-child(even) {
            animation-delay: -2s;
            animation-duration: 5s;
        }

        .shooting-star:nth-child(3n) {
            animation-delay: -3s;
            animation-duration: 3.5s;
        }

        @keyframes shootingStar {
            0% {
                opacity: 0;
                transform: translateX(-100px) translateY(50px);
            }
            10% {
                opacity: 1;
            }
            90% {
                opacity: 1;
            }

docs/index.html  view on Meta::CPAN

                const startY = Math.random() * 50 + 40; // Entre 40% et 90% de la hauteur
                shootingStar.style.top = startY + '%';
                shootingStar.style.left = '-50px';
                
                // Trajectoire aléatoire pour chaque étoile
                const randomStartY = Math.random() * 100 - 50; // Entre -50px et +50px de variation
                const randomEndY = Math.random() * 300 - 150; // Entre -150px et +150px de variation finale
                
                // Créer une animation CSS personnalisée pour cette étoile
                const animationName = `shootingStar${i}`;
                const keyframes = `
                    @keyframes ${animationName} {
                        0% {
                            opacity: 0;
                            transform: translateX(-100px) translateY(${randomStartY}px);
                        }
                        10% {
                            opacity: 1;
                        }
                        90% {
                            opacity: 1;
                        }
                        100% {
                            opacity: 0;
                            transform: translateX(calc(100vw + 100px)) translateY(${-200 + randomEndY}px);
                        }
                    }
                `;
                
                // Ajouter l'animation personnalisée au document
                const style = document.createElement('style');
                style.textContent = keyframes;
                document.head.appendChild(style);
                
                // Appliquer l'animation personnalisée avec durée aléatoire
                const duration = 3 + Math.random() * 3; // Entre 3 et 6 secondes
                shootingStar.style.animation = `${animationName} ${duration}s linear infinite`;
                shootingStar.style.animationDelay = Math.random() * 8 + 's';
                
                starsContainer.appendChild(shootingStar);
            }
        }