HTML/CSS - LoveCollector | Valentine's Special Game Online Editor and JavaScript Compiler

html

<!-- Created by Alhaaz -->
<!-- Created by Gulshan Mahawar -->
<!-- Created by Alhaaz -->
<!-- Created by Kim 반테 -->
<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
        <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
         <link href="https://fonts.googleapis.com/css2?family=Kufam&family=Share+Tech+Mono&display=swap" rel="stylesheet">
           <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css" />
           
           <script src="https://cdn.jsdelivr.net/npm/js-confetti@latest/dist/js-confetti.browser.js"></script>
</head>
<body>
<div id="thankText" style="display:none;">You Saved our Queen,<br> Thanks a lot hansome man!<br> You did it by Collecting Queen's Heart<br> in your Bucket, and guess what Our Queen<br> wants to be Yours forever.<br> Happy Valentine's Month.</div>
<h1 class="celebration wiggle"></h1>
<audio src="https://dl.dropbox.com/s/r477ru8r2jhjhmp/Custom.mp3" id='bg_audio'>
</audio>
<img src="https://www.altcoinspeak.com/assets/img/iq-img.jpg" id="game_bg_img">

css

/* Created by Alhaaz */
/* Created by Gulshan Mahawar */
/* Created by Alhaaz */
/* Created by Kim 반테 */
@import url(https://fonts.googleapis.com/css?family=Bigshot+One);
@import url("https://fonts.googleapis.com/css2?family=Red+Rose&display=swap");  
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
#c{
    background-color:red;
    padding-left:10px;
    padding-right:10px;
}
body {
    background-color:black;
    background-repeat:no-repeat;
    font-family: sans-serif;
    overflow-x:hidden;
    margin:0;padding:0;

// Created by Alhaaz
// Created by Gulshan Mahawar
// Created by Alhaaz
// Created by Kim 반테
window.onload = function() {
    setTimeout(() => {
        document.querySelector('.preloader').style.display = 'none';
    }, 300);
};
function startGame() {
alert("Points:-\n❤️: 15 points\n💣: -15 points\n💔: -10 points\n❤️‍🩹:10 points\n\nCollect Items in your bucket by dragging your fingers, and try to Fill the bar to Save Your Queen. You have 5 lifes\n\nGood luck!")
document.getElementById('bg_audio').play(); document.getElementById("game_bg_img").style.display = "inline-block";
    
    var quotes = ["I could search my whole life<br> through and never find another you.", "To the world, <br>you may be one person,<br> but to me, you are the world." , "You are the missing piece<br> I’ve been trying to find.", "I wish I could<br> turn back the clock.<br> I'd find you sooner and<br> love you longer.", "I never knew how much love<br> my heart could hold until<br> I met you.", "When I saw you,<br> I fell in love,<br> and you smiled because you knew.", "Loving you is like breathing-<br>I can’t stop and<br> don’t want to."
    ]
    
    let quoteIndex = 1;
    
    function changeQuote(){
        document.getElementById('quote').innerHTML = quotes[quoteIndex++ % quotes.length];
    }

BROWSER

Console