-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathpage.html
More file actions
223 lines (213 loc) · 12.8 KB
/
Copy pathpage.html
File metadata and controls
223 lines (213 loc) · 12.8 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
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
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Default Template</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="style.css">
</head>
<body class="bg-light">
<!-- -Navbar -->
<nav class="navbar navbar-expand-lg bg-white small border-bottom shadow-sm fixed-top custom-nav" style="--bs-bg-opacity: .9;">
<div class="container">
<a href="index.html" class="navbar-brand">
<span class="brand-style brand-gradient">
Blog 2.0
</span>
</a>
<button type="button"
class="navbar-toggler"
data-bs-toggle="collapse"
data-bs-target="#blog-navbar"
aria-controls="blog-navbar"
aria-expanded="false"
aria-label="Toggle Navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="blog-navbar">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a href="index.html" class="nav-link text-dark">Home</a>
</li>
<li class="nav-item">
<a href="default.html" class="nav-link text-dark">Categories</a>
</li>
<li class="nav-item">
<a href="posts.html" class="nav-link text-dark">Posts</a>
</li>
<li class="nav-item">
<a href="page.html" class="nav-link text-dark">Pages</a>
</li>
<li class="nav-item">
<a href="search.html" class="nav-link text-dark">Search</a>
</li>
<li class="nav-item">
<a href="default.html" class="nav-link text-dark">Default</a>
</li>
</ul>
<form class="d-flex" role="search">
<div class="input-group">
<input type="search" class="form-control form-control-sm" placeholder="Search for..">
<button type="submit" class="btn btn-sm btn-success">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-search" viewBox="0 0 16 16">
<path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/>
</svg>
</button>
</div>
</form>
</div>
</div>
</nav>
<!-- -Navbar ends-->
<!-- -Page Header -->
<header class="main-page-header py-5 mb-3">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="page-header-holder mt-5 text-white">
<h1 class="fs-3">Lorem ipsum dolor sit amet consectetur adipisicing elit.</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Possimus animi deserunt quia alias error non, ut totam tempore quaerat sint ab, magnam soluta illum laudantium laborum! Iste perferendis rerum iure.</p>
</div>
</div>
</div>
</div>
</header>
<!-- -Page Header ends-->
<!-- -Post Loop -->
<section class="post-loop py-3 mb-3">
<div class="container">
<div class="row">
<div class="col-md-8">
<div class="content-holder">
<img class="rounded img-fluid mb-3" src="https://source.unsplash.com/random/1200x600" alt="">
<div class="post-content mb-3">
<h1>Heading one</h1>
<h2>Heading Two</h2>
<h3>Heading Three</h3>
<h4>Heading Four</h4>
<h5>Heading Five</h5>
<h6>Heading Six</h6>
<h2>Lorem ipsum dolor sit amet consectetur adipisicing elit.</h2>
<p><span>Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque dignissimos, nobis reprehenderit quas ipsam inventore architecto rerum quae corporis officia laborum repellat nostrum veniam soluta laudantium modi dicta recusandae fuga.</span><span>Voluptates, facilis? Explicabo nesciunt illo expedita, nostrum cumque, veritatis atque suscipit qui quaerat assumenda quas unde voluptas dolorem odit quis culpa consequuntur, placeat nihil quidem tempora rem dicta error labore.</span></p>
<p><span>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Maiores in accusamus nemo, voluptatibus animi, perspiciatis veritatis vitae, consequuntur eos atque aut optio nisi. Modi, placeat vel. Sunt cumque quos expedita?</span><span>At accusantium cupiditate consequuntur. Illum eveniet non, incidunt porro, repellat impedit, eum quis temporibus at ipsa necessitatibus laudantium. Aperiam ea ducimus veritatis assumenda nesciunt error repudiandae perferendis. Quibusdam, nobis quam.</span></p>
<p><span>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Enim, saepe est consectetur tempore in velit itaque odio debitis provident? Voluptas officiis asperiores nostrum labore nulla, neque quidem vero dicta mollitia?</span><span>Alias est esse architecto nobis repellendus excepturi eos, aspernatur pariatur? Eaque natus excepturi corrupti enim cumque expedita. Quae quisquam minus molestiae nobis, repellendus, amet et velit ullam, vel adipisci blanditiis.</span></p>
</div>
<div class="comment-form mb-3">
<div class="card">
<div class="card-body">
<h3 class="fs-6">Post your thoughts</h3>
<form>
<div class="row gx-2">
<div class="col-md-6">
<div class="mb-2">
<input type="text" class="form-control form-control-sm" placeholder="First Name" required>
</div>
</div>
<div class="col-md-6">
<div class="mb-2">
<input type="text" class="form-control form-control-sm" placeholder="Last Name" required>
</div>
</div>
<div class="col-md-12">
<div class="mb-2">
<input type="email" class="form-control form-control-sm" placeholder="Email" required>
</div>
</div>
<div class="col-md-12">
<div class="mb-2">
<textarea rows="10" class="form-control form-control-sm" placeholder="Your Comments"></textarea>
</div>
</div>
<div class="col-md-12">
<div class="d-grid">
<button type="submit" class="btn btn-sm btn-success">Sumbit</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card text-bg-primary mb-3">
<div class="card-body">
<h3 class="fs-4">Subscribe for newsletters</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Aperiam accusantium, consequatur.</p>
<form>
<div class="row gx-2">
<div class="col-md-6">
<div class="mb-2">
<input type="text" class="form-control form-control-sm" placeholder="First Name">
</div>
</div>
<div class="col-md-6">
<div class="mb-2">
<input type="text" class="form-control form-control-sm" placeholder="Last Name">
</div>
</div>
<div class="col-md-12">
<div class="mb-2">
<input type="email" class="form-control form-control-sm" placeholder="Email">
</div>
</div>
<div class="col-md-12">
<div class="d-grid">
<button type="submit" class="btn btn-warning btn-sm d-inline-flex align-items-center justify-content-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-envelope-check-fill me-2" viewBox="0 0 16 16">
<path d="M.05 3.555A2 2 0 0 1 2 2h12a2 2 0 0 1 1.95 1.555L8 8.414.05 3.555ZM0 4.697v7.104l5.803-3.558L0 4.697ZM6.761 8.83l-6.57 4.026A2 2 0 0 0 2 14h6.256A4.493 4.493 0 0 1 8 12.5a4.49 4.49 0 0 1 1.606-3.446l-.367-.225L8 9.586l-1.239-.757ZM16 4.697v4.974A4.491 4.491 0 0 0 12.5 8a4.49 4.49 0 0 0-1.965.45l-.338-.207L16 4.697Z"/>
<path d="M16 12.5a3.5 3.5 0 1 1-7 0 3.5 3.5 0 0 1 7 0Zm-1.993-1.679a.5.5 0 0 0-.686.172l-1.17 1.95-.547-.547a.5.5 0 0 0-.708.708l.774.773a.75.75 0 0 0 1.174-.144l1.335-2.226a.5.5 0 0 0-.172-.686Z"/>
</svg>
Subscribe
</button>
</div>
</div>
</div>
</form>
</div>
</div>
<ul class="list-group small mb-3">
<li class="list-group-item active">Archives</li>
<li class="list-group-item list-group-item-action">
<a href="#" class="text-decoration-none text-dark">2019</a>
</li>
<li class="list-group-item list-group-item-action">
<a href="#" class="text-decoration-none text-dark">2020</a>
</li>
<li class="list-group-item list-group-item-action">
<a href="#" class="text-decoration-none text-dark">2021</a>
</li>
<li class="list-group-item list-group-item-action">
<a href="#" class="text-decoration-none text-dark">2022</a>
</li>
</ul>
<ul class="list-group small mb-3">
<li class="list-group-item active">Categories</li>
<li class="list-group-item list-group-item-action">
<a href="#" class="text-decoration-none text-dark">Tech</a>
</li>
<li class="list-group-item list-group-item-action">
<a href="#" class="text-decoration-none text-dark">Life</a>
</li>
<li class="list-group-item list-group-item-action">
<a href="#" class="text-decoration-none text-dark">Fashion</a>
</li>
<li class="list-group-item list-group-item-action">
<a href="#" class="text-decoration-none text-dark">Modern</a>
</li>
</ul>
</div>
</div>
</div>
</section>
<!-- -Post Loop ends-->
<!-- -Blog Footer -->
<footer class="main-footer text-bg-dark p-4 text-center">
<p class="m-0"><small>Copyright © 2022. All rights reseverd.</small></p>
</footer>
<!-- -Blog Footer ends-->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>