Lve/index.html at main · Karthik7-github/Lve · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="style.css" />
    <link rel="stylesheet" href="Spin-Wheel-App/Spin Wheel App/style.css">
    <link rel="stylesheet" href="MCQ Quiz App/style.css">
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"
      integrity="sha512-2SwdPD6INVrV/lHTZbO2nodKhrnDdJK9/kg2XD1r9uGqPo1cUbujc+IYdlYdEErWNu69gVcYgdxlmVmzTWnetw=="
      crossorigin="anonymous"
      referrerpolicy="no-referrer"
    />
    <title>Document</title>
  </head>
  <body>
    <section class="Mainpage" id="Home">
      <div class="navbar">
        <div class="sty">
          <i class="fa-solid fa-heart heart"></i>
          <i class="fa-solid fa-heart heart"></i>
          <i class="fa-solid fa-heart heart"></i>
          <i class="fa-solid fa-heart heart"></i>
          <i class="fa-solid fa-heart heart"></i>
          <i class="fa-solid fa-heart heart"></i>
          <i class="fa-solid fa-heart heart"></i>
        </div>
        <div class="texts">
          <h1>𝑯𝒂𝒑𝒑𝒚 𝑽𝒂𝒍𝒆𝒏𝒕𝒊𝒏𝒆'𝒔 𝑫𝒂𝒚</h1>
          <h3>𝑾𝒊𝒍𝒍 𝒚𝒐𝒖 𝒃𝒆 𝒎𝒚 𝑽𝒂𝒍𝒆𝒏𝒕𝒊𝒏𝒆 😣</h3>
        </div>
        <div class="buttons">
          <button id="yesBtn">𝒀𝒆𝒔</button>
          <button id="noBtn">𝑵𝒐</button>
        </div>
      </div>
      <div class="thanks">
        <h1>𝕀 𝕃𝕆𝕍𝔼 𝕐𝕆𝕌</h1>
        <br />
        <!-- <h2>𝙸 𝚑𝚊𝚟𝚎 𝚜𝚘𝚖𝚎𝚝𝚑𝚒𝚗𝚐 𝚏𝚘𝚛 𝚞🫣</h2> -->
        <div class="gif"></div>
        <br />
        <a href="#letterforu"
          ><button class="check" id="letter" onclick="check()">
            ᴄʟɪᴄᴋ ᴍᴇ
          </button></a
        >
      </div>
    </section>
    <section class="letter" id="letterforu">
      <a href="#memories"
        ><button onclick="memroies()" class="seeurmemories">
          𝒮𝑒𝑒 𝒪𝓊𝓇 𝑀𝑒𝓂𝑜𝓇𝒾𝑒𝓈
        </button></a
      >
    </section>
    <section class="memories" id="memories">
      <div class="headmem">
        <h1 style="background-color: wheat; padding: 10px">𝑴𝒆𝒎𝒐𝒓𝒊𝒆𝒔</h1>
      </div>
      <!-- <div class="pics"> -->
        <div class="pics">
          <div class="images image1">
            <div class="overlay">
              <span style="font-size: medium;">Text</span>
              <span>𝘼𝙥𝙧𝙞𝙡 6 2025</span>
            </div>
          </div>
          <div class="images image2">
            <div class="overlay">
              <span style="font-size: medium; text-align: center;">Text</span>
              <span>𝙅𝙪𝙣𝙚 15 2025</span>
            </div>
          </div>

          <div class="images image3">
            <div class="overlay">
              <span style="font-size: medium; text-align: center;">Text</span>
              <span>𝘼𝙪𝙜𝙪𝙨𝙩 1 2025</span>
            </div>
          </div>
          <div class="images image4">
            <div class="overlay">
              <span style="font-size: medium; text-align: center;">Text</span>
              <span>𝙊𝙘𝙩𝙤𝙗𝙚𝙧 5 2025</span>
            </div>
          </div>
        </div>
      </div>
        <div class="pics">
  <div class="images image5">
    <div class="overlay">
     <span style="font-size: medium; text-align: center;">Text</span>
     <span>𝘿𝙚𝙘𝙚𝙢𝙗𝙚𝙧 7 2025</span>
    </div>
  </div>
  <div class="images image6">
    <div class="overlay">
      <span style="font-size: medium; text-align: center;">Text</span>
     <span>𝙅𝙖𝙣𝙪𝙖𝙧𝙮 24 2026</span>
    </div>
  </div>
  <div class="images image7">
    <div class="overlay">
      <span style="font-size: medium; text-align: center;">𝙂𝙖𝙣𝙣𝙖𝙫𝙖𝙧𝙖𝙢 𝙙𝙖𝙩𝙚, 𝙛𝙤𝙧𝙚𝙫𝙚𝙧 𝙞𝙣 𝙢𝙮 𝙝𝙚𝙖𝙧𝙩 🌍💑</span>
     <span>𝙅𝙖𝙣𝙪𝙖𝙧𝙮 31 2026</span>
    </div>
  </div>

  <div class="images image8">
    <div class="overlay">
      <span style="font-size: medium; text-align: center;">Text</span>
     <span>𝙁𝙚𝙗𝙧𝙪𝙖𝙧𝙮 1 2026</span>
    </div>
  </div>
</div>
      </div>
      <div class="date-btn">
        <a href="#date" class="show-date" onclick="dates()"><button>𝙊𝙪𝙧 𝙙𝙖𝙩𝙚𝙨</button></a>
      </div>
    </section>
    <section class="dates" id="date">
      <div class="date-text">
        <h1 style="color: black;">𝕯𝖆𝖙𝖊𝖘</h1>
        <br><br>
        <span>Text</span>
        <br><br>
        <a href="#quiz-time"><button class="play-quiz-btn">ᴘʟᴀʏ Qᴜɪᴢ</button></a>
      </div>
      <div class="date-pics">
        <div class="dp">
        </div>
</div>
    </section>
    <section class="quiz" id="quiz-time">
  <div class="start-screen">
    <button id="start-button">Start</button>
  </div>
  <div id="display-container" class="hide">
    <div class="header">
      <div class="number-of-count">
        <span class="number-of-question">1 of 3 questions</span>
      </div>
      <div class="timer-div">
        <img src="MCQ Quiz App/timer-icon.svg" alt="timer">
        <span class="time-left">10s</span>
      </div>
    </div>

    <div id="container"></div>

    <button id="next-button" style="border: 1.5px solid black; background-color:#ff257e;">Next</button>
  </div>
  <div class="score-container hide">
  <p id="user-score"></p>
  <a href="#your-wishes" style="text-decoration: none;"><button class="wishbutton" id="next-page-btn" style="display:none; border-radius: 5px; width: 200px; height: 40px; margin-top: 40px;" onclick="wishbtn()">
    Okay Now Make Your Wishes
  </button></a>
</div>
    </section>
<section class="spin-section" id="your-wishes">
  <div class="spin-left">
    <span class="arrow"></span>
    <button id="spin">Spin</button>
    <div class="container">
      <div class="one">1</div>
      <div class="two">2</div>
      <div class="three">3</div>
      <div class="four">4</div>
      <div class="five">5</div>
      <div class="six">6</div>
      <div class="seven">7</div>
      <div class="eight">8</div>
    </div>
  </div>
<div class="spin-right">
  <h2>𝙎𝙥𝙞𝙣 𝙏𝙝𝙞𝙨 𝙩𝙝𝙧𝙚𝙚 𝙩𝙞𝙢𝙚𝙨 ❤️</h2>
  <div id="results"></div>
  <a href="#her"><button class="herbtn" onclick="herpage()">Click After 3 spins</button></a>
</div>
</section>
    <section class="her" id="her">
      <div class="finalpic"></div>
      <div class="leftside">
      </div>
      <div class="rightside">
        <div class="up">
  <h2>𝙉𝙤 𝙢𝙖𝙩𝙩𝙚𝙧</h2>
  <h2>𝙃𝙤𝙬 𝙁𝙖𝙧</h2>
  <h2>𝙃𝙤𝙬 𝙇𝙤𝙣𝙜</h2>
  <h2>𝙃𝙤𝙬 𝙃𝙖𝙧𝙙</h2>
  <h2>𝙄𝙩’𝙨 𝙖𝙡𝙬𝙖𝙮𝙨 𝙮𝙤𝙪</h2>
</div>
        <div class="down">
        </div>
      </div>
    </section>
    <script src="script.js"></script>
    <script src="MCQ Quiz App/script.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.9.1/chart.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-datalabels/2.2.0/chartjs-plugin-datalabels.min.js"></script>

  <script src="Spin-Wheel-App/Spin Wheel App/script.js"></script>
  </body>
</html>