-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
123 lines (117 loc) · 5.21 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
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
<!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="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="css/bootstrap-reboot.min.css" />
<link rel="stylesheet" href="css/bootstrap-grid.min.css" />
<link
rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.8.2/css/all.css"
integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay"
crossorigin="anonymous"
/>
<link rel="shortcut icon" href="icons/favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="css/style.css" />
<title>Explorer</title>
</head>
<body>
<section class="main">
<img class="main_img" src="icons/IMAGE Header.png" alt="Logo" />
<div class="menu">
<nav class="nav">
<a class="nav-link active nav_item" aria-current="page" href="#"
>Home</a
>
<a class="nav-link nav_item" href="#">Blog</a>
<a class="nav-link nav_item" href="#">Categories</a>
<a class="nav-link nav_item disabled" href="#">Pick Category</a>
<a class="nav-link nav_item disabled" href="#">About us</a>
<a class="nav-link nav_item disabled" href="#">Contact us</a>
</nav>
</div>
<div class="blog">
<div class="places">
<img src="icons/Frame (1).png" alt="blog" />
<div class="places_descr">
Vestibulum ut placerat nisl. Cras sed purus tellus. Pellentesque
habitant morbi tristique senectus et netus et malesuada fames ac
turpis egestas. Duis posuere nisi sit amet neque finibus vestibulum.
Vivamus at leo ut turpis posuere molestie. Nullam at turpis nec
metus pharetra bibendum. Vivamus id urna et leo blandit consequat.
<br />
<span class="continue">
<a class="link" href="#">Continue Reading →</a>
</span>
</div>
</div>
<div class="gear">
<div class="gear_img">
<img src="icons/Frame (2).png" alt="blog" />
</div>
<div class="gear_descr">
Vestibulum ut placerat nisl. Cras sed purus tellus. Pellentesque
habitant morbi tristique senectus et netus et malesuada fames ac
turpis egestas. Duis posuere nisi sit amet neque finibus vestibulum.
Vivamus at leo ut turpis posuere molestie. Nullam at turpis nec
metus pharetra bibendum. Vivamus id urna et leo blandit consequat.
<br />
<span> <a href="#" class="link"> Continue Reading →</a></span>
</div>
</div>
<div class="photography">
<img src="icons/Frame (4).png" alt="blog" />
<div class="photography_descr">
Vestibulum ut placerat nisl. Cras sed purus tellus. Pellentesque
habitant morbi tristique senectus et netus et malesuada fames ac
turpis egestas. Duis posuere nisi sit amet neque finibus vestibulum.
Vivamus at leo ut turpis posuere molestie. Nullam at turpis nec
metus pharetra bibendum. Vivamus id urna et leo blandit consequat.
<br />
<a href="#" class="link">Continue Reading →</a>
</div>
</div>
</div>
</section>
<section class="stories">
<h1 class="stories_header">Featured Stories</h1>
<h3 class="stories_subheader">Did you read our personal favorites?</h3>
<div class="image-container">
<div class="image-wrapper first">
<img src="icons/Frame (5).png" alt="Image 1">
<div class="caption">The 10 most beautiful places you should visit in your life</div>
</div>
<div class="image-wrapper">
<img src="icons/Frame (6).png" alt="Image 2">
<div class="caption">We found the most beautiful place for our party november</div>
</div>
<div class="image-wrapper third">
<img src="icons/Frame (7).png" alt="Image 3">
<div class="caption">Why New York is still our favorite city to visit</div>
</div>
</div>
</div>
<div class="full">
<div class="full_text">
Want to read all of our stories?
<a href="#" class="link">Read the full blog</a>
</div>
</div>
</section>
<footer class="footer">
<div class="footer_header">
Copyright © Explorer - Images used for demonstration purpose only (<a class="firstlink" href="#">Licenses</a>)
</div>
<div class="footer_subheader">
Copyright © <a href="#" class="secondlink">Studio Corvus</a> Powered by <a href="#" class="thirdlink">Webflow</a>
</div>
</footer>
</body>
</html>