-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
105 lines (101 loc) · 5.41 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
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
<!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>Project website</title>
<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=Source+Sans+Pro:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700;1,900&display=swap" rel="stylesheet">
<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=Oswald:wght@200;300;400;500;600;700&display=swap" rel="stylesheet">
<script src="./main.js"></script>
<link rel="stylesheet" href="scss_styles/style.css">
</head>
<body>
<header>
<div class="header__container">
<a class="header__container__logo-text" href="index.html">Project</a>
<img src="assets/Header__menu.png" alt ="burger-menu" class="header__container__burger-menu-button">
<nav class="header__container__nav-container">
<a href="index.html">Projects</a>
<a href="index.html">About us</a>
<a href="index.html">Stories</a>
<a href="index.html">Contact</a>
</nav>
</div>
</header>
<main>
<section class="headline-section">
<img class="headline-section__background-lights--opacity" src="./assets/lights_background.png" alt="lights">
<img class="headline-section__background-stars--scale" src="./assets/stars_background.png" alt="stars">
<article class="headline-section__container">
<img src="assets/big-logo.png" alt="logo1">
<h1>
Your Headline <br> Here
</h1>
<h2>
Lorem ipsum dolor sit amet, consectetur <br> adipiscing elit sed do eiusmod.
</h2>
</article>
</section>
<section class="description-section">
<article class="description-section__container">
<h1>
This is the Section Headline, Continues to <br>Two Lines
</h1>
<h2>
Lorem ipsum dolor sit amet, consectetur adipiscing elit sed do eiusmod.
</h2>
<div class="description-section__container__text-container">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis.
</p>
<p>
Minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
</div>
<!-- added div to adjust design for mobile -->
<div class="description-section__container__button-container">
<button type="button">
Read More
</button>
</div>
</article>
</section>
<section class="learn-more-section" id="learn-more-section">
<div class="learn-more-section__color-layer">
<article class="learn-more-section__color-layer__content-container">
<h1>
Learn more <br>about our culture...
</h1>
<button><img class="learn-more-section__color-layer__content-container__play-img--normal" src="assets/play.svg"><img class="learn-more-section__color-layer__content-container__play-img--hover" src="assets/play_hover.svg"></button>
<h2>
Duis aute irure dolor in reprehenderit <br>in voluptate velit esse cillum dolore eu <br>fugiat nulla pariatur.
</h2>
</article>
</div>
</section>
</main>
<footer>
<div class="footer-container">
<div class="footer-container__left-footer-container">
<div class="footer-container__left-footer-container__footer-logo-container">
<img src="assets/footer-logo.png" alt="footer-logo">
<h3>Project</h3>
</div>
<div class="footer-container__left-footer-container__footer-contact-container">
<p>
123 Street, <br>Anytown, USA 12345
</p>
<a href="index.html">[email protected]</a>
</div>
</div>
<p class="footer-container__copyright-text">© 2021 Project. All rights reserved</p>
</div>
</footer>
</body>
</html>