Skip to content

Commit 978b3a5

Browse files
authored
Merge pull request #23 from sergiozeppo/sergiozeppo/favicon
Add favicon
2 parents f6e0f42 + fa7c764 commit 978b3a5

File tree

2 files changed

+217
-89
lines changed

2 files changed

+217
-89
lines changed

icons/icon.png

1.05 KB
Loading

index.html

+217-89
Original file line numberDiff line numberDiff line change
@@ -1,124 +1,252 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8">
5-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
66
<title>Sorting Hat Quiz</title>
7-
<link rel="stylesheet" href="styles.css">
8-
</head>
9-
<body>
10-
11-
<div class="image-container">
12-
<img src="https://imgs.search.brave.com/6Sffhw0RU1m6DlaxDyoDRRJrLVhXStCPmkCoCG_0A8Y/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly9tZWRp/YS5wcm9wcm9mcy5j/b20vaW1hZ2VzL1FN/L3VzZXJfaW1hZ2Vz/LzI1MDM4NTIvUG90/dGVybW9yZS1Ib3Vz/ZS1Tb3J0aW5nLUhh/dC0ud2VicA"
13-
alt="Hogwarts">
14-
</div>
15-
<div class="spell-container">
16-
<div class="spell-internal-container">
7+
<link rel="stylesheet" href="styles.css" />
8+
<link rel="icon" href="./icons/icon.png" />
9+
</head>
10+
<body>
11+
<div class="image-container">
12+
<img
13+
src="https://imgs.search.brave.com/6Sffhw0RU1m6DlaxDyoDRRJrLVhXStCPmkCoCG_0A8Y/rs:fit:860:0:0:0/g:ce/aHR0cHM6Ly9tZWRp/YS5wcm9wcm9mcy5j/b20vaW1hZ2VzL1FN/L3VzZXJfaW1hZ2Vz/LzI1MDM4NTIvUG90/dGVybW9yZS1Ib3Vz/ZS1Tb3J0aW5nLUhh/dC0ud2VicA"
14+
alt="Hogwarts"
15+
/>
16+
</div>
17+
<div class="spell-container">
18+
<div class="spell-internal-container">
1719
<div>
18-
<h1>Spell of the day</h1>
20+
<h1>Spell of the day</h1>
21+
</div>
22+
<button id="generateSpellBtn">Today's Spell</button>
23+
<div class="spell-box">
24+
<span id="spellText" class="spell-text"></span>
1925
</div>
20-
<button id="generateSpellBtn">Today's Spell</button>
21-
<div class="spell-box">
22-
<span id="spellText" class="spell-text"></span>
26+
</div>
2327
</div>
24-
</div>
25-
</div>
26-
<div class="container">
27-
<h1>Which Hogwarts House Do You Belong To?</h1>
28-
<p>Answer the questions below to find out your house!</p>
28+
<div class="container">
29+
<h1>Which Hogwarts House Do You Belong To?</h1>
30+
<p>Answer the questions below to find out your house!</p>
2931

30-
<form id="quizForm">
32+
<form id="quizForm">
3133
<div class="question">
32-
<h3>1. What do you value the most?</h3>
33-
<label><input type="radio" name="q1" value="Gryffindor"> Bravery</label>
34-
<label><input type="radio" name="q1" value="Ravenclaw"> Knowledge</label>
35-
<label><input type="radio" name="q1" value="Hufflepuff"> Loyalty</label>
36-
<label><input type="radio" name="q1" value="Slytherin"> Ambition</label>
34+
<h3>1. What do you value the most?</h3>
35+
<label
36+
><input type="radio" name="q1" value="Gryffindor" /> Bravery</label
37+
>
38+
<label
39+
><input type="radio" name="q1" value="Ravenclaw" /> Knowledge</label
40+
>
41+
<label
42+
><input type="radio" name="q1" value="Hufflepuff" /> Loyalty</label
43+
>
44+
<label
45+
><input type="radio" name="q1" value="Slytherin" /> Ambition</label
46+
>
3747
</div>
3848
<div class="question">
39-
<h3>2. What would you do in a difficult situation?</h3>
40-
<label><input type="radio" name="q2" value="Gryffindor"> Face it head-on</label>
41-
<label><input type="radio" name="q2" value="Ravenclaw"> Think it through logically</label>
42-
<label><input type="radio" name="q2" value="Hufflepuff"> Seek help from friends</label>
43-
<label><input type="radio" name="q2" value="Slytherin"> Do what benefits you the most</label>
49+
<h3>2. What would you do in a difficult situation?</h3>
50+
<label
51+
><input type="radio" name="q2" value="Gryffindor" /> Face it
52+
head-on</label
53+
>
54+
<label
55+
><input type="radio" name="q2" value="Ravenclaw" /> Think it through
56+
logically</label
57+
>
58+
<label
59+
><input type="radio" name="q2" value="Hufflepuff" /> Seek help from
60+
friends</label
61+
>
62+
<label
63+
><input type="radio" name="q2" value="Slytherin" /> Do what benefits
64+
you the most</label
65+
>
4466
</div>
4567
<div class="question">
46-
<h3>3. What's your biggest strength?</h3>
47-
<label><input type="radio" name="q3" value="Gryffindor"> Courage</label>
48-
<label><input type="radio" name="q3" value="Ravenclaw"> Intelligence</label>
49-
<label><input type="radio" name="q3" value="Hufflepuff"> Patience</label>
50-
<label><input type="radio" name="q3" value="Slytherin"> Determination</label>
68+
<h3>3. What's your biggest strength?</h3>
69+
<label
70+
><input type="radio" name="q3" value="Gryffindor" /> Courage</label
71+
>
72+
<label
73+
><input type="radio" name="q3" value="Ravenclaw" />
74+
Intelligence</label
75+
>
76+
<label
77+
><input type="radio" name="q3" value="Hufflepuff" /> Patience</label
78+
>
79+
<label
80+
><input type="radio" name="q3" value="Slytherin" />
81+
Determination</label
82+
>
5183
</div>
5284
<div class="question">
53-
<h3>4. How do you prefer to spend your free time?</h3>
54-
<label><input type="radio" name="q4" value="Gryffindor"> Adventuring</label>
55-
<label><input type="radio" name="q4" value="Ravenclaw"> Reading</label>
56-
<label><input type="radio" name="q4" value="Hufflepuff"> Helping others</label>
57-
<label><input type="radio" name="q4" value="Slytherin"> Networking</label>
85+
<h3>4. How do you prefer to spend your free time?</h3>
86+
<label
87+
><input type="radio" name="q4" value="Gryffindor" />
88+
Adventuring</label
89+
>
90+
<label
91+
><input type="radio" name="q4" value="Ravenclaw" /> Reading</label
92+
>
93+
<label
94+
><input type="radio" name="q4" value="Hufflepuff" /> Helping
95+
others</label
96+
>
97+
<label
98+
><input type="radio" name="q4" value="Slytherin" />
99+
Networking</label
100+
>
58101
</div>
59102
<div class="question">
60-
<h3>5. What is your ideal pet?</h3>
61-
<label><input type="radio" name="q5" value="Gryffindor"> A brave dog</label>
62-
<label><input type="radio" name="q5" value="Ravenclaw"> An intelligent owl</label>
63-
<label><input type="radio" name="q5" value="Hufflepuff"> A loyal cat</label>
64-
<label><input type="radio" name="q5" value="Slytherin"> A clever ferret</label>
103+
<h3>5. What is your ideal pet?</h3>
104+
<label
105+
><input type="radio" name="q5" value="Gryffindor" /> A brave
106+
dog</label
107+
>
108+
<label
109+
><input type="radio" name="q5" value="Ravenclaw" /> An intelligent
110+
owl</label
111+
>
112+
<label
113+
><input type="radio" name="q5" value="Hufflepuff" /> A loyal
114+
cat</label
115+
>
116+
<label
117+
><input type="radio" name="q5" value="Slytherin" /> A clever
118+
ferret</label
119+
>
65120
</div>
66121
<div class="question">
67-
<h3>6. Which of these words resonates with you the most?</h3>
68-
<label><input type="radio" name="q6" value="Gryffindor"> Fearless</label>
69-
<label><input type="radio" name="q6" value="Ravenclaw"> Wise</label>
70-
<label><input type="radio" name="q6" value="Hufflepuff"> Kind</label>
71-
<label><input type="radio" name="q6" value="Slytherin"> Cunning</label>
122+
<h3>6. Which of these words resonates with you the most?</h3>
123+
<label
124+
><input type="radio" name="q6" value="Gryffindor" /> Fearless</label
125+
>
126+
<label><input type="radio" name="q6" value="Ravenclaw" /> Wise</label>
127+
<label
128+
><input type="radio" name="q6" value="Hufflepuff" /> Kind</label
129+
>
130+
<label
131+
><input type="radio" name="q6" value="Slytherin" /> Cunning</label
132+
>
72133
</div>
73134
<div class="question">
74-
<h3>7. What kind of leader are you?</h3>
75-
<label><input type="radio" name="q7" value="Gryffindor"> Bold and decisive</label>
76-
<label><input type="radio" name="q7" value="Ravenclaw"> Thoughtful and strategic</label>
77-
<label><input type="radio" name="q7" value="Hufflepuff"> Supportive and inclusive</label>
78-
<label><input type="radio" name="q7" value="Slytherin"> Ambitious and influential</label>
135+
<h3>7. What kind of leader are you?</h3>
136+
<label
137+
><input type="radio" name="q7" value="Gryffindor" /> Bold and
138+
decisive</label
139+
>
140+
<label
141+
><input type="radio" name="q7" value="Ravenclaw" /> Thoughtful and
142+
strategic</label
143+
>
144+
<label
145+
><input type="radio" name="q7" value="Hufflepuff" /> Supportive and
146+
inclusive</label
147+
>
148+
<label
149+
><input type="radio" name="q7" value="Slytherin" /> Ambitious and
150+
influential</label
151+
>
79152
</div>
80153
<div class="question">
81-
<h3>8. What would you like to be known for?</h3>
82-
<label><input type="radio" name="q8" value="Gryffindor"> Courageous acts</label>
83-
<label><input type="radio" name="q8" value="Ravenclaw"> Innovations</label>
84-
<label><input type="radio" name="q8" value="Hufflepuff"> Kindness</label>
85-
<label><input type="radio" name="q8" value="Slytherin"> Strategic success</label>
154+
<h3>8. What would you like to be known for?</h3>
155+
<label
156+
><input type="radio" name="q8" value="Gryffindor" /> Courageous
157+
acts</label
158+
>
159+
<label
160+
><input type="radio" name="q8" value="Ravenclaw" />
161+
Innovations</label
162+
>
163+
<label
164+
><input type="radio" name="q8" value="Hufflepuff" /> Kindness</label
165+
>
166+
<label
167+
><input type="radio" name="q8" value="Slytherin" /> Strategic
168+
success</label
169+
>
86170
</div>
87171
<div class="question">
88-
<h3>9. If you were at Hogwarts, what would be your favorite subject?</h3>
89-
<label><input type="radio" name="q9" value="Slytherin"> Potions</label>
90-
<label><input type="radio" name="q9" value="Gryffindor"> Defense Against the Dark Arts</label>
91-
<label><input type="radio" name="q9" value="Hufflepuff"> Herbology</label>
92-
<label><input type="radio" name="q9" value="Ravenclaw"> Transfiguration</label>
172+
<h3>
173+
9. If you were at Hogwarts, what would be your favorite subject?
174+
</h3>
175+
<label
176+
><input type="radio" name="q9" value="Slytherin" /> Potions</label
177+
>
178+
<label
179+
><input type="radio" name="q9" value="Gryffindor" /> Defense Against
180+
the Dark Arts</label
181+
>
182+
<label
183+
><input type="radio" name="q9" value="Hufflepuff" />
184+
Herbology</label
185+
>
186+
<label
187+
><input type="radio" name="q9" value="Ravenclaw" />
188+
Transfiguration</label
189+
>
93190
</div>
94191
<div class="question">
95-
<h3>10. What is your ideal way to spend a weekend?</h3>
96-
<label><input type="radio" name="q10" value="Ravenclaw"> Reading a book or learning something new</label>
97-
<label><input type="radio" name="q10" value="Gryffindor"> Going on an adventure with friends</label>
98-
<label><input type="radio" name="q10" value="Hufflepuff"> Spending time with loved ones</label>
99-
<label><input type="radio" name="q10" value="Slytherin"> Working on personal goals or projects</label>
192+
<h3>10. What is your ideal way to spend a weekend?</h3>
193+
<label
194+
><input type="radio" name="q10" value="Ravenclaw" /> Reading a book
195+
or learning something new</label
196+
>
197+
<label
198+
><input type="radio" name="q10" value="Gryffindor" /> Going on an
199+
adventure with friends</label
200+
>
201+
<label
202+
><input type="radio" name="q10" value="Hufflepuff" /> Spending time
203+
with loved ones</label
204+
>
205+
<label
206+
><input type="radio" name="q10" value="Slytherin" /> Working on
207+
personal goals or projects</label
208+
>
100209
</div>
101210
<div class="question">
102-
<h3>11. What is your biggest fear?</h3>
103-
<label><input type="radio" name="q11" value="Slytherin"> Failure</label>
104-
<label><input type="radio" name="q11" value="Gryffindor"> Being powerless</label>
105-
<label><input type="radio" name="q11" value="Hufflepuff"> Losing those I care about</label>
106-
<label><input type="radio" name="q11" value="Ravenclaw"> Being average</label>
211+
<h3>11. What is your biggest fear?</h3>
212+
<label
213+
><input type="radio" name="q11" value="Slytherin" /> Failure</label
214+
>
215+
<label
216+
><input type="radio" name="q11" value="Gryffindor" /> Being
217+
powerless</label
218+
>
219+
<label
220+
><input type="radio" name="q11" value="Hufflepuff" /> Losing those I
221+
care about</label
222+
>
223+
<label
224+
><input type="radio" name="q11" value="Ravenclaw" /> Being
225+
average</label
226+
>
107227
</div>
108228
<div class="question">
109-
<h3>12. Which color do you feel most drawn to?</h3>
110-
<label><input type="radio" name="q12" value="Ravenclaw"> Blue</label>
111-
<label><input type="radio" name="q12" value="Gryffindor"> Red</label>
112-
<label><input type="radio" name="q12" value="Hufflepuff"> Yellow</label>
113-
<label><input type="radio" name="q12" value="Slytherin"> Green</label>
229+
<h3>12. Which color do you feel most drawn to?</h3>
230+
<label
231+
><input type="radio" name="q12" value="Ravenclaw" /> Blue</label
232+
>
233+
<label
234+
><input type="radio" name="q12" value="Gryffindor" /> Red</label
235+
>
236+
<label
237+
><input type="radio" name="q12" value="Hufflepuff" /> Yellow</label
238+
>
239+
<label
240+
><input type="radio" name="q12" value="Slytherin" /> Green</label
241+
>
114242
</div>
115243
<button type="submit">Get Sorted!</button>
116-
</form>
244+
</form>
117245

118-
<div id="result" class="result"></div>
119-
<img id="houseImage" src="" alt="" style="display:none;">
120-
</div>
246+
<div id="result" class="result"></div>
247+
<img id="houseImage" src="" alt="" style="display: none" />
248+
</div>
121249

122-
<script src="script.js"></script>
123-
</body>
250+
<script src="script.js"></script>
251+
</body>
124252
</html>

0 commit comments

Comments
 (0)