@@ -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