-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
72 lines (72 loc) · 3.27 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
67
68
69
70
71
72
<!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">
<link rel="stylesheet" href="styles.css">
<!-- Google Fonts -->
<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=Poppins&display=swap" rel="stylesheet">
<!------------------------------------------------------------------->
<title>HTML Assignment</title>
</head>
<body>
<header>
<nav class="navbar">
<h1 class="header-logo">Header Logo</h1>
<ul class="navs">
<li><a href="#">header link one</a></li>
<li><a href="#">header link two</a></li>
<li><a href="#">header link three</a></li>
</ul>
</nav>
</header>
<main>
<section class="hero">
<div class="hero-text column">
<h1>This website is awesome</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Recusandae dicta facere, totam nemo earum aliquam temporibus rerum odio architecto tenetur ea. totam nemo earum aliquam temporibus rerum odio architecto tenetur ea.</p>
<button type="submit">Sign Up</button>
</div>
<figure class="column">
<img src="./images/Placeholder_view_vector.svg.png">
</figure>
</section>
<div class="card-section">
<h2>Some Random Information</h2>
<section class="cards">
<section class="card">
<img src="./images/Placeholder_view_vector.svg.png" alt="Card Image">
<p>This is some subtext under an illustration or image</p>
</section>
<section class="card">
<img src="./images/Placeholder_view_vector.svg.png" alt="Card Image">
<p>This is some subtext under an illustration or image</p>
</section>
<section class="card">
<img src="./images/Placeholder_view_vector.svg.png" alt="Card Image">
<p>This is some subtext under an illustration or image</p>
</section>
<section class="card">
<img src="./images/Placeholder_view_vector.svg.png" alt="Card Image">
<p>This is some subtext under an illustration or image</p>
</section>
</div>
</section>
<blockquote>
<p>This is an ispiring quote, or a testimonial from a customer. Maybe it's just filling up space, or maybe people will actually read it. All I know is that it's look nice.</p>
<p class="quote-author"><cite>Thor, The God of Thunder</cite></p>
</blockquote>
<section class="call_to_action">
<h3>Call to action! It's time!</h3>
<p>Sign up for our product by clicking that button right over there</p>
<button type="submit">Sign Up</button>
</section>
</main>
<footer class="footer">
<p>Copyright © The Odin Project 2021</p>
</footer>
</body>
</html>