Skip to content

Commit 8abffcc

Browse files
Move reading mood quiz to bottom of index page
1 parent f945eb8 commit 8abffcc

1 file changed

Lines changed: 65 additions & 64 deletions

File tree

‎frontend/pages/index.html‎

Lines changed: 65 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -144,70 +144,6 @@ <h1>Find yourself in the pages.</h1>
144144
<p>A curated sanctuary for those who read through emotions.</p>
145145
</section>
146146

147-
<!-- Reading mood quiz section -->
148-
<section class="reading-mood-quiz" id="readingMoodQuiz">
149-
<div class="quiz-container">
150-
<h2>Reading Mood Quiz</h2>
151-
<p>
152-
Answer a few quick questions to discover mood tags for personalized book
153-
recommendations.
154-
</p>
155-
156-
<div class="quiz-question">
157-
<h3>1. What is your current reading mood?</h3>
158-
<div class="quiz-options" data-question="mood">
159-
<button type="button" data-value="cozy">Cozy</button>
160-
<button type="button" data-value="dark">Dark</button>
161-
<button type="button" data-value="romantic">Romantic</button>
162-
<button type="button" data-value="mysterious">Mysterious</button>
163-
<button type="button" data-value="adventurous">Adventurous</button>
164-
</div>
165-
</div>
166-
167-
<div class="quiz-question">
168-
<h3>2. Which genre do you prefer right now?</h3>
169-
<div class="quiz-options" data-question="genre">
170-
<button type="button" data-value="romance">Romance</button>
171-
<button type="button" data-value="mystery">Mystery</button>
172-
<button type="button" data-value="fantasy">Fantasy</button>
173-
<button type="button" data-value="self-help">Self-help</button>
174-
<button type="button" data-value="thriller">Thriller</button>
175-
</div>
176-
</div>
177-
178-
<div class="quiz-question">
179-
<h3>3. What reading pace do you want?</h3>
180-
<div class="quiz-options" data-question="pace">
181-
<button type="button" data-value="quick-read">Quick read</button>
182-
<button type="button" data-value="medium-paced">Medium paced</button>
183-
<button type="button" data-value="slow-immersive">Slow immersive</button>
184-
</div>
185-
</div>
186-
187-
<div class="quiz-question">
188-
<h3>4. What story vibe are you looking for?</h3>
189-
<div class="quiz-options" data-question="vibe">
190-
<button type="button" data-value="light-hearted">Light-hearted</button>
191-
<button type="button" data-value="emotional">Emotional</button>
192-
<button type="button" data-value="suspenseful">Suspenseful</button>
193-
<button type="button" data-value="inspiring">Inspiring</button>
194-
<button type="button" data-value="magical">Magical</button>
195-
</div>
196-
</div>
197-
198-
<button type="button" id="generateMoodTags" class="generate-tags-btn" disabled>
199-
Generate Mood Tags
200-
</button>
201-
202-
<div class="quiz-results" id="quizResults" hidden>
203-
<h3>Your Reading Mood Tags</h3>
204-
<div class="mood-tags" id="moodTags"></div>
205-
<button type="button" id="retakeQuiz" class="retake-quiz-btn">
206-
Retake Quiz
207-
</button>
208-
</div>
209-
</div>
210-
</section>
211147
<!-- SEARCH RESULTS SECTION (Initially Hidden) -->
212148
<section id="search-results-section" class="curated-section" hidden>
213149
<div class="section-header">
@@ -415,6 +351,71 @@ <h3>Wandering Philosopher</h3>
415351

416352
</section>
417353

354+
<!-- Reading mood quiz section -->
355+
<section class="reading-mood-quiz" id="readingMoodQuiz">
356+
<div class="quiz-container">
357+
<h2>Reading Mood Quiz</h2>
358+
<p>
359+
Answer a few quick questions to discover mood tags for personalized book
360+
recommendations.
361+
</p>
362+
363+
<div class="quiz-question">
364+
<h3>1. What is your current reading mood?</h3>
365+
<div class="quiz-options" data-question="mood">
366+
<button type="button" data-value="cozy">Cozy</button>
367+
<button type="button" data-value="dark">Dark</button>
368+
<button type="button" data-value="romantic">Romantic</button>
369+
<button type="button" data-value="mysterious">Mysterious</button>
370+
<button type="button" data-value="adventurous">Adventurous</button>
371+
</div>
372+
</div>
373+
374+
<div class="quiz-question">
375+
<h3>2. Which genre do you prefer right now?</h3>
376+
<div class="quiz-options" data-question="genre">
377+
<button type="button" data-value="romance">Romance</button>
378+
<button type="button" data-value="mystery">Mystery</button>
379+
<button type="button" data-value="fantasy">Fantasy</button>
380+
<button type="button" data-value="self-help">Self-help</button>
381+
<button type="button" data-value="thriller">Thriller</button>
382+
</div>
383+
</div>
384+
385+
<div class="quiz-question">
386+
<h3>3. What reading pace do you want?</h3>
387+
<div class="quiz-options" data-question="pace">
388+
<button type="button" data-value="quick-read">Quick read</button>
389+
<button type="button" data-value="medium-paced">Medium paced</button>
390+
<button type="button" data-value="slow-immersive">Slow immersive</button>
391+
</div>
392+
</div>
393+
394+
<div class="quiz-question">
395+
<h3>4. What story vibe are you looking for?</h3>
396+
<div class="quiz-options" data-question="vibe">
397+
<button type="button" data-value="light-hearted">Light-hearted</button>
398+
<button type="button" data-value="emotional">Emotional</button>
399+
<button type="button" data-value="suspenseful">Suspenseful</button>
400+
<button type="button" data-value="inspiring">Inspiring</button>
401+
<button type="button" data-value="magical">Magical</button>
402+
</div>
403+
</div>
404+
405+
<button type="button" id="generateMoodTags" class="generate-tags-btn" disabled>
406+
Generate Mood Tags
407+
</button>
408+
409+
<div class="quiz-results" id="quizResults" hidden>
410+
<h3>Your Reading Mood Tags</h3>
411+
<div class="mood-tags" id="moodTags"></div>
412+
<button type="button" id="retakeQuiz" class="retake-quiz-btn">
413+
Retake Quiz
414+
</button>
415+
</div>
416+
</div>
417+
</section>
418+
418419

419420
<!--The footer is being called usingt footer.js.-->
420421
<script src="../js/config.js"></script>

0 commit comments

Comments
 (0)