-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
66 lines (61 loc) · 2.78 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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Random Inspirational Quotes | Quote API</title>
<link rel="shortcut icon" href="images/favicon.png" type="image/x-icon">
<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=Berkshire+Swash&family=Courgette&family=Merienda+One&family=Rancho&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="css/styles.css">
</head>
<body>
<div class="container-theme">
<img id="btn-theme-change" src="images/sun.png"></img>
</div>
<h1 class="main-title">Random Inspirational Quotes</h1>
<div class="quote-container">
<div class="quote-card">
<h2 class="main-quote" id="double-quotes-id">
<span class="double-quotes">“ </span>
<span id="editQuote">
Some people thrive on huge, dramatic change.
Some people prefer the slow and steady route.
Do what's right for you.
</span>
<span class="double-quotes"> ”</span>
</h2>
<h3 class="author-name">
<span class="author-dash">— </span>
<span id="editAuthor">
Julie Morgenstern
</span>
</h3>
</div>
</div>
<progress max="190" value="0" id="progressBar" class="progressBar-html5"></progress>
<h2 class="refresh-text">
Refresh for new ones.
<svg height="20" width="20">
<path id="word"
d="M10 16.667Q7.208 16.667 5.271 14.729Q3.333 12.792 3.333 10Q3.333 7.208 5.271 5.271Q7.208 3.333 10 3.333Q11.417
3.333 12.688 3.917Q13.958 4.5 14.917 5.562V3.333H16.667V9.292H10.708V7.542H14.229Q13.562 6.417 12.438 5.75Q11.312
5.083 10 5.083Q7.958 5.083 6.521 6.521Q5.083 7.958 5.083 10Q5.083 12.042 6.521 13.479Q7.958 14.917 10 14.917Q11.562
14.917 12.833 14.021Q14.104 13.125 14.604 11.646H16.458Q15.854 13.854 14.073 15.26Q12.292 16.667 10 16.667Z" />
</svg> </h2>
<div class="footer">
<h4>
Ⓒ Copyright 2023 | Designed & Coded by
<a href="https://its-mavi-dev.netlify.app/" target="_blank">Mahaveer</a>.
</h4>
<h4>
Inspirational quotes provided by <a href="https://quotable.io/" target="_blank">Quotable.io API</a>
</h4>
</div>
<script src="js/main.js"></script>
</body>
</html>