// ---------- HELPER: show romantic message & celebration ---------- function showAcceptance() // Celebration effect: confetti & big romantic message questionDiv.innerHTML = "๐ YOU SAID YES! ๐ <br> ๐ HAMESHA SATH ๐"; questionDiv.style.background = "#ffdae2"; // Change response area with proposal accepted gifSpan.innerHTML = "๐๐๐๐๐"; messagePara.innerHTML = "YAYYY! ๐ TUMNE HAAN KARDI! ๐ <br> Main aapko hamesha pyaar karunga/karungi. Ab shaadi ki taiyari shuru! ๐ฅณโจ"; responseDiv.style.background = "#fff0c0"; // Disable buttons after yes yesBtn.disabled = true; noBtn.disabled = true; yesBtn.style.opacity = "0.6"; noBtn.style.opacity = "0.6"; yesBtn.style.cursor = "default"; noBtn.style.cursor = "default"; // Add confetti effect triggerConfetti(); // extra romantic touch: floating hearts createFloatingHearts();
h1 font-size: 2.6rem; font-weight: bold; background: linear-gradient(135deg, #b62b4b, #ff8c9e); background-clip: text; -webkit-background-clip: text; color: transparent; margin: 0.5rem 0 0.2rem; letter-spacing: -0.5px;
<script> (function() // ----- DOM elements ----- const yesBtn = document.getElementById('yesBtn'); const noBtn = document.getElementById('noBtn'); const responseDiv = document.getElementById('responseArea'); const messagePara = document.getElementById('messageText'); const gifSpan = document.querySelector('#responseArea .gif-placeholder'); const card = document.getElementById('proposalCard'); const questionDiv = document.getElementById('questionText'); index of mujhse shaadi karogi
.heart-icon font-size: 4.2rem; animation: pulse 1.5s infinite ease; display: inline-block; margin-bottom: 0.5rem;
.question background: #fff2f4; border-radius: 60px; padding: 0.7rem 1rem; font-size: 1.8rem; font-weight: bold; color: #a13046; margin: 1.2rem 0 1.5rem; box-shadow: inset 0 0 0 1px white, 0 6px 12px rgba(0,0,0,0.05); // ---------- HELPER: show romantic message & celebration
// reset any previous absolute style if window resizes (to avoid break) window.addEventListener('resize', function() if(noBtn.style.position === 'absolute') // re-adjust position after resize const btnContainer = document.querySelector('.buttons'); if(btnContainer) const maxLeft = btnContainer.clientWidth - noBtn.offsetWidth - 10; const maxTop = btnContainer.clientHeight - noBtn.offsetHeight - 5; if(maxLeft > 0 && maxTop > 0) let leftVal = parseFloat(noBtn.style.left); let topVal = parseFloat(noBtn.style.top); if(isNaN(leftVal)) leftVal = 20; if(isNaN(topVal)) topVal = 10; noBtn.style.left = Math.min(maxLeft, leftVal) + 'px'; noBtn.style.top = Math.min(maxTop, topVal) + 'px'; );
.proposal-card max-width: 550px; width: 100%; background: rgba(255, 255, 255, 0.96); border-radius: 56px; box-shadow: 0 25px 45px rgba(0, 0, 0, 0.3), 0 0 0 8px rgba(255, 215, 0, 0.3); overflow: hidden; transition: all 0.2s ease; backdrop-filter: blur(1px); text-align: center; padding: 2rem 1.8rem 2.5rem; ๐ <br> Main aapko hamesha pyaar karunga/karungi
.glow animation: happyGlow 0.6s ease-out; @keyframes happyGlow 0% background: #fff7e0; box-shadow: 0 0 0 0 #ffccaa; 100% background: #fff0f2; </style> </head> <body>