-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathblog.html
169 lines (162 loc) · 9.83 KB
/
blog.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
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">
<link href="css/style.css" rel="stylesheet">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css">
<title>Blog | Ariel Sperduti | Software Developer</title>
</head>
<body>
<!-- Navbar -->
<header>
<nav class="navbar navbar-expand-lg navbar-light bg-white shadow fixed-top">
<div class="container-fluid">
<a class="navbar-brand" href="#">
<img class="img-fluid" src="images/favicon.png" width="45" height="45" alt="">
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup"
aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-link" href="index.html">Home</a>
<a class="nav-link active" href="blog.html">Blog <span class="sr-only">(current)</span></a>
<a class="nav-link" href="contact.html">Contact</a>
</div>
</div>
</div>
</nav>
</header>
<!--Hi-iam quick introduction-->
<main>
<div class="container bg-grey">
<div class="row justify-content-center">
<div class="col-12 col-md-8 col-lg-6 text-center">
<p class="h2"><strong>Get exclusive content</strong></p>
<p class="lead">
Receive my curated list of content every month.
</p>
<div class="input-group mt-4 mb-4">
<input type="text" class="form-control" placeholder="Enter your email address">
<div class="input-group-append">
<button class="btn btn-primary" type="button">Submit</button>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row block">
<div class="col-lg-8 col-md-10 mx-auto">
<article>
<a href="post.html">
<h2 class="post-title">Post Example</h2>
</a>
<p class="small text-center">
<img src="images/profile_pic.png" alt="Ariel Sperduti's photo"
class="blog-post-header-author-img img-fluid rounded-circle bg-grey">
by Ariel Sperduti. Updated on Feb. 04, 2020
</p>
<p class="text-justify">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce gravida magna tincidunt, tristique est non, ultrices
nisi. Proin efficitur, mi eget luctus semper, mauris augue porttitor magna, nec commodo risus eros nec dui. Nulla
posuere ex ut mauris cursus malesuada. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce mattis
hendrerit ultrices. Ut ultrices laoreet erat, vel blandit augue vulputate eu. Nullam nec libero nibh. Nunc tempus
lectus ut tempus sollicitudin. Cras maximus est sit amet interdum mollis. Nullam sed porttitor nisl, pretium rutrum
metus. Fusce vulputate eu nunc a feugiat. Proin eget bibendum lectus, in pulvinar eros. Etiam sagittis sem et ligula
fermentum accumsan.
</p>
<a href="post.html" class="btn btn-primary">Continue reading</a>
<hr>
</article>
<article>
<a href="post.html">
<h2 class="post-title">Post Example</h2>
</a>
<p class="small text-center">
<img src="images/profile_pic.png" alt="Ariel Sperduti's photo"
class="blog-post-header-author-img img-fluid rounded-circle bg-grey">
by Ariel Sperduti. Updated on Feb. 04, 2020
</p>
<p class="text-justify">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce gravida magna tincidunt, tristique est non,
ultrices
nisi. Proin efficitur, mi eget luctus semper, mauris augue porttitor magna, nec commodo risus eros nec dui.
Nulla
posuere ex ut mauris cursus malesuada. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce
mattis
hendrerit ultrices. Ut ultrices laoreet erat, vel blandit augue vulputate eu. Nullam nec libero nibh. Nunc
tempus
lectus ut tempus sollicitudin. Cras maximus est sit amet interdum mollis. Nullam sed porttitor nisl, pretium
rutrum
metus. Fusce vulputate eu nunc a feugiat. Proin eget bibendum lectus, in pulvinar eros. Etiam sagittis sem et
ligula
fermentum accumsan.
</p>
<a href="post.html" class="btn btn-primary">Continue reading</a>
<hr>
</article>
<article>
<a href="post.html">
<h2 class="post-title">Post Example</h2>
</a>
<p class="small text-center">
<img src="images/profile_pic.png" alt="Ariel Sperduti's photo"
class="blog-post-header-author-img img-fluid rounded-circle bg-grey">
by Ariel Sperduti. Updated on Feb. 04, 2020
</p>
<p class="text-justify">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce gravida magna tincidunt, tristique est non,
ultrices
nisi. Proin efficitur, mi eget luctus semper, mauris augue porttitor magna, nec commodo risus eros nec dui.
Nulla
posuere ex ut mauris cursus malesuada. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce
mattis
hendrerit ultrices. Ut ultrices laoreet erat, vel blandit augue vulputate eu. Nullam nec libero nibh. Nunc
tempus
lectus ut tempus sollicitudin. Cras maximus est sit amet interdum mollis. Nullam sed porttitor nisl, pretium
rutrum
metus. Fusce vulputate eu nunc a feugiat. Proin eget bibendum lectus, in pulvinar eros. Etiam sagittis sem et
ligula
fermentum accumsan.
</p>
<a href="post.html" class="btn btn-primary">Continue reading</a>
<hr>
</article>
</div>
</div>
</div>
</main>
</div>
<!--Footer-->
<footer class="footer mt-auto bg-dark py-3">
<div class="container">
<div class="row text-center align-items-center">
<div class="col">
<ul class="nav justify-content-center">
<li class="nav-item">
<a class="nav-link active" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="blog.html">Blog</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Contact</a>
</li>
</ul>
<p>© 1988-2021 Pancho by <a href="https://arielsperduti.com">Ariel Sperduti</a></p>
</div>
</div>
</div>
</footer>
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf"
crossorigin="anonymous"></script>
</body>
</html>