-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathblog1.html
99 lines (96 loc) · 6.31 KB
/
blog1.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
<!doctype html>
<html>
<head>
<title>Grey Nomad</title>
<link href="https://fonts.googleapis.com/css2?family=Parisienne&family=Rochester&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Quicksand&display=swap" rel="stylesheet">
<link href="css/blog.css" rel="stylesheet" type="text/css">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" />
</head>
<body>
<!-- navigation bar -->
<nav class="navbar">
<!-- navigation links -->
<ul class="navlinks">
<li><a href="index.html">Home</a></li>
<li><a href="#suscribe">Suscribe</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
<!-- social links -->
<ul class="sociallinks">
<li><a href="https://www.facebook.com" target="_blank"><img src="images/icons/facebook.png" alt="facebook"></a></li>
<li><a href="https://www.instagram.com" target="_blank"><img src="images/icons/instagram.png" alt="instagram"></a></li>
<li><a href="https://www.twitter.com" target="_blank"><img src="images/icons/twitter.png" alt="twitter"></a></li>
<li><a href="https://www.pinterest.com" target="_blank"><img src="images/icons/pinterest.png" alt="pinterest"></a></li>
</ul>
</nav>
<!-- blog page -->
<section class="blogpage">
<div class="blogcontent">
<article class="author">
<img class="authorpic" src="./images/me.jpg" alt="author"/>
<span class="authorname">Himanshu Aggarwal</span>
<span class="readtime">15 minutes read</span>
</article>
<div class="blogposttitle">Blog 1 Title</div>
<div class="blogsubtitle">Create a blog post subtitle that summarizes your post in a few short, punchy sentences and entices your audience to continue reading.</div>
<div class="blogpostimage" id="blog_1"></div>
<p>Welcome to your blog post. Use this space to connect with your readers and potential customers in a way that’s current and interesting. Think of it as an ongoing conversation where you can share updates about business, trends, news, and more.</p>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Perferendis numquam alias illum voluptatibus reprehenderit odit nostrum quis. Suscipit eos, ut consequatur aliquid provident voluptas corrupti saepe magni quas vero quidem?
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Deserunt soluta nobis dolores, necessitatibus recusandae excepturi dolorum vero. Perspiciatis, optio quis distinctio ad eos possimus, facilis similique corporis voluptates laboriosam nisi!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellendus beatae doloribus inventore assumenda vel quam nesciunt deserunt enim maiores provident. Excepturi odio enim fugit. Eos incidunt aspernatur illo dolores officia!</p>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Perferendis numquam alias illum voluptatibus reprehenderit odit nostrum quis. Suscipit eos, ut consequatur aliquid provident voluptas corrupti saepe magni quas vero quidem?
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Deserunt soluta nobis dolores, necessitatibus recusandae excepturi dolorum vero. Perspiciatis, optio quis distinctio ad eos possimus, facilis similique corporis voluptates laboriosam nisi!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellendus beatae doloribus inventore assumenda vel quam nesciunt deserunt enim maiores provident. Excepturi odio enim fugit. Eos incidunt aspernatur illo dolores officia!</p>
</div>
</section>
<!-- social platforms -->
<section class="social">
<div class="instagram">
<a href="https://www.instagram.com" target="_blank"><img class="socialicon" src="images/icons/instagram.png" /></a>
<span>Instagram</span>
</div>
<div class="facebook">
<a href="https://www.facebook.com" target="_blank"><img class="socialicon" src="images/icons/facebook.png" /></a>
<span>Facebook</span>
</div>
<div class="twitter">
<a href="https://www.twitter.com" target="_blank"><img class="socialicon" src="images/icons/twitter.png" /></a>
<span>Twitter</span>
</div>
<div class="pinterest">
<a href="https://www.pinterest.com" target="_blank"><img class="socialicon" src="images/icons/pinterest.png" /></a>
<span>Pinterest</span>
</div>
</section>
<!-- author information and subscription -->
<footer class="footer">
<!-- author information -->
<section class="about" id="contact">
<span class="footerheading fh">About Me</span>
<figure class="fi">
<img src="images/me.jpg" alt="me">
<figcaption>Himanshu Aggarwal</figcaption>
</figure>
<span class="fd">About the blog author: Name, Title, Current Company/School, Short Bio, Lorem ipsum dolor sit amet consectetur, adipisicing elit. Lorem ipsum dolor sit.</span>
<span class="fe"><strong>[email protected]</strong></span>
</section>
<!-- subscription -->
<section class="suscribe" id="suscribe">
<span class="footerheading">Join My Mailing List</span>
<form class="suscribeform">
<label for="username">Enter your name here <span class="mandatory">*</span></label>
<br/>
<input type="text" id="username">
<br/>
<label for="userid">Enter your email here <span class="mandatory">*</span></label>
<br/>
<input type="text" id="userid">
<br/>
<button class="join">Suscribe Now</button>
</form>
</section>
</footer>
</body>
</html>