-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
97 lines (93 loc) · 7.99 KB
/
index.html
File metadata and controls
97 lines (93 loc) · 7.99 KB
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1">
<link rel="shortcut icon" href="files/favicon.ico" type="image/x-icon">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@600&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@600&family=Roboto&family=Roboto+Condensed&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Bree+Serif&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
<title>GoBlog</title>
</head>
<body>
<header>
<nav class="navigation">
<div class="navcontainer">
<div class="mob__NavBar">
<div class="toggle__lines"></div>
<!-- <div class="toggle__lines"></div>
<div class="toggle__lines"></div> -->
</div>
<!-- <div class="menu-btn">
<div class="menu-btn__burger"></div>
</div> -->
<ul class="navlistwrapper">
<li><a class="nav_links" title="HomePage" href="#"><img style="height: 0.9rem; margin-right: 10px;" src="files/home-solid.svg" alt="">HOME</a></li>
<li><a class="nav_links" href="www.google.com" target="_blank">BLOGS</a></li>
<li><a class="nav_links" href="#">PODCASTS</a></li>
<li><a class="nav_links" href="#">ABOUT US</a></li>
<li class="login"><a class="nav_links" href="#">LOGIN</a></li>
<li class="signup"><a class="nav_links" href="#">SIGN UP</a></li>
<li><input type="text" name="search" class="searchbar" placeholder="Search..."></li>
<li><a href="#" class="searchbtn"><img class="searchicon" src="files/search-solid.svg" alt="Find"></a></li>
<!-- <li><button class="searchbtn" type="button"><img src="files/searchicon.svg" alt="searchbutton"></button></li> -->
</ul>
<!-- </div>
<div class="mob__navigation">
<div class="toggleNavBar">
<div class="toggle__lines"></div>
</div>
<ul class="mob__navLinks">
<li><a href="#" class="nav_links" title="HomePage"><img style="height: 0.9rem; margin-right: 10px;" src="files/home-solid.svg" alt="">HOME</a></li>
<li><a href="#" class="nav_links">BLOGS</a></li>
<li><a href="#" class="nav_links">PODCASTS</a></li>
<li><a href="#" class="nav_links">LOGIN</a></li>
<li><a href="#" class="nav_links">SIGNUP</a></li>
</ul>
</div> -->
</nav>
</header>
<section class="bodywrapper">
<section class="midsection">
<div class="container">
<div class="content">
<h1>Everything you need<br> to start blogging is here!</h1>
<a class="getstarted" href="#">Get Started for Free</a>
</div>
</div>
</section>
<section class="lowersection">
<div class="lsheader">
<h1>Trending Stories<img src="files/chart-line-solid.svg" alt="graph" class="trendingicon"></h1></div>
<div class="grid-wrapper">
<div class="items"><div class="posthead"><img class="postimage" src="files/lake1-min.jpg" alt="post-pic"><div><h1 class="postPname">Margot Roboto</h1><p class="postPexp">Software Engineer, Ex-AmXXzon</p></div></div><div class="postPbio"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur, harum? Lorem ipsum dolor sit amet consectetur adipisicing elit. Facilis, enim?Lorem ipsum dolor, sit amet consectetur adipisicing elit. A, quo. Lorem ipsum, dolor sit amet consectetur adipisicing elit. Placeat in nulla, ipsa enim excepturi quos.</p></div></div>
<div class="items"><div class="posthead"><img class="postimage" src="files/lake1-min.jpg" alt="post-pic"><div><h1 class="postPname">Margot Roboto</h1><p class="postPexp">Software Engineer</p></div></div><div class="postPbio"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur, harum? Lorem ipsum dolor sit amet consectetur adipisicing elit. Facilis, enim? Lorem ipsum, dolor sit amet consectetur adipisicing elit. Placeat in nulla, ipsa enim excepturi quos.</p></div></div>
<div class="items"><div class="posthead"><img class="postimage" src="files/lake1-min.jpg" alt="post-pic"><div><h1 class="postPname">Margot Roboto</h1><p class="postPexp">Software Engineer, Ex-AmXXzon</p></div></div><div class="postPbio"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur, harum? Lorem ipsum dolor sit amet consectetur adipisicing elit. Facilis, enim? Lorem ipsum, dolor sit amet consectetur adipisicing elit. Placeat in nulla, ipsa enim excepturi quos.</p></div></div>
<div class="items"><div class="posthead"><img class="postimage" src="files/lake1-min.jpg" alt="post-pic"><div><h1 class="postPname">Margot Roboto</h1><p class="postPexp">Software Engineer, Ex-AmXXzon</p></div></div><div class="postPbio"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur, harum? Lorem ipsum dolor sit amet consectetur adipisicing elit. Facilis, enim? Lorem ipsum, dolor sit amet consectetur adipisicing elit. Placeat in nulla, ipsa enim excepturi quos.</p></div></div>
<div class="items"><div class="posthead"><img class="postimage" src="files/lake1-min.jpg" alt="post-pic"><div><h1 class="postPname">Margot Roboto</h1><p class="postPexp">Software Engineer, Ex-AmXXzon</p></div></div><div class="postPbio"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur, harum? Lorem ipsum dolor sit amet consectetur adipisicing elit. Facilis, enim? Lorem ipsum, dolor sit amet consectetur adipisicing elit. Placeat in nulla, ipsa enim excepturi quos.</p></div></div>
<div class="items"><div class="posthead"><img class="postimage" src="files/lake1-min.jpg" alt="post-pic"><div><h1 class="postPname">Margot Roboto</h1><p class="postPexp">Software Engineer, Ex-AmXXzon</p></div></div><div class="postPbio"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur, harum? Lorem ipsum dolor sit amet consectetur adipisicing elit. Facilis, enim? Lorem ipsum, dolor sit amet consectetur adipisicing elit. Placeat in nulla, ipsa enim excepturi quos.</p></div></div>
</div>
<div class="testimonial">
<a href="#">Full Testimonial<img src="files/right-arrow-.svg" alt=""></a></div>
</section>
<section class="lowersection_2">
<div class="grid-wrapper">
<div class="items_lower"><div class="postLowerHead"><h1 class="postP_l_name">What? 👀</h1></div><div class="postPbio"><p class="postLowerp">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur, harum? Lorem ipsum dolor sit amet consectetur adipisicing elit. Facilis, enim?Lorem ipsum dolor, sit amet consectetur a.</p></div></div>
<div class="items_lower"><div class="postLowerHead"><h1 class="postP_l_name">Why? 😍</h1></div><div class="postPbio"><p class="postLowerp">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur, harum? Lorem ipsum dolor sit amet consectetur adipisicing elit. Facilis, enim?Lorem ipsum dolor,Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quas, assumenda? sit amet consectetur a.</p></div></div>
<div class="items_lower"><div class="postPbio"><img class="pLH-image" src="files/mario.jpg" alt="" srcset=""></div></div>
</div>
</section>
</section>
<footer>
<div class="socialmedia">
<a href="#">Facebook</a>
<a href="#">Telegram</a>
<a href="#">Instagram</a>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>