Skip to content

happy birthday yariniii #1404

@moneerab-droid

Description

@moneerab-droid
<title>YARONTIII MAIN CHARACTER ERA</title> <script src="https://cdn.jsdelivr.net/npm/canvas-confetti@1.6.0/dist/confetti.browser.min.js"></script> <style>

body {
margin:0;
font-family: 'Poppins', sans-serif;
background: linear-gradient(-45deg, #ff4e91, #ff8fb1, #ffc3a0, #ff4e91);
background-size: 400% 400%;
animation: gradient 8s ease infinite;
color: white;
text-align:center;
display:flex;
justify-content:center;
align-items:center;
height:100vh;
overflow:hidden;
}

@Keyframes gradient {
0% {background-position: 0% 50%;}
50% {background-position: 100% 50%;}
100% {background-position: 0% 50%;}
}

.container {
max-width:700px;
padding:20px;
animation: fadeIn 2s ease-in-out;
}

h1 {
font-size:3rem;
animation: pop 1s ease-in-out infinite alternate;
}

@Keyframes pop {
from { transform: scale(1);}
to { transform: scale(1.08);}
}

p {
font-size:1.3rem;
margin-top:20px;
}

button {
margin-top:25px;
padding:15px 30px;
font-size:1.1rem;
border:none;
border-radius:40px;
background:white;
color:#ff4e91;
cursor:pointer;
transition:0.3s;
}

button:hover {
transform: scale(1.15) rotate(-2deg);
}

.hidden {
display:none;
}

.horse {
font-size:4rem;
margin-top:20px;
animation: bounce 1s infinite;
}

@Keyframes bounce {
0%,100% {transform: translateY(0);}
50% {transform: translateY(-15px);}
}

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

</style>

HAPPY BIRTHDAY YARONTIII 🎉💖

BESTIE. I love you so much and I miss you more than dramatic movie scenes miss background music. I am SO proud of you. And I am the luckiest human alive to have you in my life.

UNLOCK CHAOS 🎁

GET READY 👀✨ Your main character fun day is loading… Full of things you LOVE. Laughing until we can’t breathe. Chaos. Memories. Happiness.

<div class="horse">🐎</div>

<p>
  Saddle up queen.  
  This is your era.  
</p>
<script> function chaos() { document.getElementById("secret").classList.remove("hidden"); var duration = 3 * 1000; var end = Date.now() + duration; (function frame() { confetti({ particleCount: 7, angle: 60, spread: 70, origin: { x: 0 } }); confetti({ particleCount: 7, angle: 120, spread: 70, origin: { x: 1 } }); if (Date.now() < end) { requestAnimationFrame(frame); } }()); } </script>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions