-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
42 lines (37 loc) · 1.77 KB
/
index.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/png" sizes="32x32" href="./images/favicon-32x32.png">
<link rel="stylesheet" href="index.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Overpass:wght@400;700&display=swap" rel="stylesheet">
<title>Frontend Mentor | Interactive rating component</title>
</head>
<body>
<!-- The first page is coded into the html in the "page" div and once the submit button is clicked, the html is changes through the JavaScript to change to the "tahnk-page"-->
<div id="page">
<div id="star-img">
<img id="star" src="images/icon-star.svg" alt="star">
</div>
<h1>How did we do?</h1>
<p>Please let us know how we did with your support request. All feedback is appreciated to help us improve our offering!</p>
<div id="rate">
<button id="rate-1" class="rate-btn" value="1">1</button>
<button id="rate-2" class="rate-btn" value="2">2</button>
<button id="rate-3" class="rate-btn" value="3">3</button>
<button id="rate-4" class="rate-btn" value="4">4</button>
<button id="rate-5" class="rate-btn" value="5">5</button>
</div>
<button id="submit-btn">Submit</button>
<div id="select-rating"></div>
</div>
<script src="index.js"></script>
</body>
<footer>
<div class="attribution">Challenge by <a href="https://www.frontendmentor.io/profile/terka-codes" target="_blank">Frontend Mentor</a>. Coded by <a href="https://twitter.com/TerkaCodes" target="_blank">@TerkaCodes</a>.
</div>
</footer>
</html>