-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathblog-detail.html
275 lines (259 loc) · 18.7 KB
/
blog-detail.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
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
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Simple Blog | Blog Details</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<link rel="stylesheet" href="assets/css/custom.css">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL"
crossorigin="anonymous"></script>
<!--Import Poppins Font-->
<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=Poppins:wght@300;400;500&display=swap" rel="stylesheet">
</head>
<body>
<nav class="navbar navbar-tools bg-body-tertiary">
<div class="container-fluid">
<div class="d-none d-lg-block"> </div>
<a class="navbar-brand d-none d-lg-block" href="https://www.iscosoftware.com" target="_blank">
<img src="./assets/img/logo.png" class="img-fluid" width="120" alt="Company Logo" srcset="">
</a>
<form class="col-8 col-lg-auto d-flex mx-auto me-lg-0" role="search">
<input class="form-control xweb__form-control me-1" type="search" placeholder="Search"
aria-label="Search">
<button class="btn xweb__btn btn-primary xweb__btn-primary" type="submit">Search</button>
</form>
</div>
</nav>
<nav class="navbar navbar-main navbar-expand-lg bg-body-tertiary border border-1 border-bottom border-muted">
<div class="container-fluid">
<a class="navbar-brand d-block d-lg-none" href="https://www.iscosoftware.com" target="_blank">
<img src="./assets/img/logo.png" class="img-fluid" width="120" alt="Company Logo" srcset="">
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mx-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="./index.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Category 1</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Category 2</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Category 3</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Category 4</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Category 5</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
aria-expanded="false">
Dropdown
</a>
<ul class="dropdown-menu xweb__dropdown-menu">
<li><a class="dropdown-item" href="#">Action</a></li>
<li><a class="dropdown-item" href="#">Another action</a></li>
<li>
<hr class="dropdown-divider">
</li>
<li><a class="dropdown-item" href="#">Something else here</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
<section class="py-5" id="header" style="background-image: url('assets/img/blog_detail.jpg');">
<div class="px-4 py-5 my-5 text-center">
<h1 class="display-5 fw-bold text-body-emphasis">My Blog Title</h1>
<div class="col-lg-6 mx-auto">
<p class="lead mb-4">Topic: Hello World!
</p>
</div>
</div>
</section>
<section class="py-5" id="blogContent">
<div class="container text-center">
<h1>But Where is My Bed?</h1>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Illo quod ad odio pariatur beatae molestiae
tempora eaque magni accusamus illum. Vero harum doloribus, provident expedita explicabo blanditiis
suscipit possimus in dicta repellat odio aspernatur fuga! Quidem quae consequatur dolores at mollitia
ducimus, quaerat optio, eaque totam impedit rerum sit magnam iusto officiis, vero ab! Est enim
voluptatem nam nemo autem vero. Aspernatur a ipsa temporibus eos? Sint odio dicta vero officia nostrum
eaque atque quae architecto. Dolores sunt corporis, minima eligendi exercitationem veniam similique
porro dolor pariatur blanditiis accusamus nisi maiores sapiente delectus asperiores commodi facere
repudiandae perferendis alias nihil? Nam voluptates, tempore magni repellendus veritatis quae
architecto voluptas eligendi, iste totam voluptatibus facilis illum pariatur perferendis ipsa error
hic ullam sint quis cum eveniet perspiciatis! Vel eaque voluptas laboriosam nihil nisi sequi numquam
quod modi, <br /> ratione magni atque iure provident impedit nesciunt molestiae qui, natus laudantium
ea tempore sapiente, dolores autem quam. Eum culpa voluptas hic, ea totam sint cumque laborum ipsa. Ut
provident accusamus harum cupiditate officiis sint sed aliquid ipsum repellendus nisi cumque quibusdam
deleniti perspiciatis voluptatem, officia suscipit eum ex sunt vero. Consequuntur saepe, facilis qui
itaque possimus dolores fugit illum, delectus suscipit repellat minus aliquid perferendis, beatae
numquam non aperiam eligendi recusandae harum doloremque eum voluptatem hic. Debitis vero consequatur
blanditiis quas odit optio saepe veniam autem suscipit porro officiis at reiciendis, eaque nulla, vel
exercitationem? Similique, doloribus ex adipisci iste, et tenetur dolores maiores, laudantium
veritatis delectus nesciunt maxime qui molestias perspiciatis <br /> <br /> quasi nobis saepe enim
molestiae nam! Nisi omnis nesciunt libero. Tempora ratione quae laudantium quaerat qui. Facilis, hic
voluptate totam impedit repellendus perspiciatis, dolor recusandae, aliquam veniam cumque animi nulla
suscipit adipisci. Sint nulla architecto obcaecati aliquam aspernatur, asperiores facilis possimus
sunt reiciendis, laudantium adipisci. Laborum modi delectus maiores. Nulla voluptas mollitia et
accusamus inventore ratione reprehenderit perspiciatis neque delectus ducimus nisi sapiente quisquam,
numquam voluptatum quos corrupti quam animi. Commodi incidunt laborum cum sapiente quasi officiis
dolorem atque? Aperiam dolorem magni rem aspernatur blanditiis quasi! Ullam maxime nisi amet optio
dolorem facilis ut, ipsa deleniti, impedit, quisquam numquam soluta? Ducimus omnis similique
architecto maiores corporis consequatur unde aliquid quis perferendis ex veritatis corrupti sequi,
odio, voluptatibus eligendi excepturi repudiandae consectetur est asperiores. Vero eius officia fuga
fugit iusto beatae aspernatur illo unde nostrum perspiciatis. Debitis quasi, commodi repellendus
ipsum, sed rem velit et molestiae obcaecati placeat aspernatur laboriosam tempore at animi ullam
officiis quas, illum sint quo dolor ea vel facilis alias? A, dignissimos. Quis eligendi ullam totam
aut est laboriosam, facere dicta nemo debitis tempora praesentium unde obcaecati dolor porro? Laborum,
ab. Beatae eius repellendus porro voluptates accusamus maxime libero pariatur repudiandae deleniti?
Voluptatem ipsa deserunt eius libero nemo laudantium earum maiores quia inventore provident fugit
dolorem sint vel officiis, ad neque in iure omnis soluta minima ipsam illum laborum. Enim sapiente
labore distinctio, quidem eius magni incidunt veritatis nobis soluta architecto at omnis facere?
Cupiditate, perferendis sequi, tempora eius placeat asperiores saepe, deserunt eum neque atque vel
similique ad?
</div>
</section>
<hr/>
<section id="comments" class="pt-3 pb-5">
<div class="container">
<div class="d-flex align-items-center rounded border border-1 p-3 my-3">
<div class="flex-shrink-0">
<img src="https://placehold.co/75x75" class="rounded-circle" width="75" height="75"
alt="User Profile">
</div>
<div class="flex-grow-1 ms-3">
<h5 class="mt-0">Kaan Ikizler</h5>
<h6>Member</h6>
This is some content from a media component. You can replace this with any content and
adjust it
as needed.
</div>
</div>
</div>
</section>
<section class="py-5" id="writeYourComment">
<div class="container">
<h6 class="text-center display-6">Leave Your Comment</h6>
<div class="col-12 col-xl-6 mt-3 mx-auto">
<form>
<div class="mb-3">
<label for="exampleInputEmail1" class="form-label text-left">Your Email address</label>
<input type="email" value="[email protected]" placeholder="Your E-Mail Address" class="form-control" id="exampleInputEmail1"
aria-describedby="emailHelp">
</div>
<div class="mb-3">
<label for="exampleFormControlTextarea1" class="form-label">Your Comment</label>
<textarea class="form-control" id="exampleFormControlTextarea1" placeholder="Your Comment" rows="6">I Really Dont Know...</textarea>
</div>
<div class="col-10 mx-auto">
<button type="submit"
class="btn btn-primary xweb__btn xweb__btn-primary w-100">Submit</button>
</div>
</form>
</div>
</div>
</section>
<section class="pt-5 border-top bg-light" id="footer">
<div class="container">
<footer class="py-5">
<div class="row">
<div class="col-6 col-md-2 mb-3">
<h5>Section</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">Home</a></li>
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">Features</a></li>
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">Pricing</a></li>
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">FAQs</a></li>
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">About</a></li>
</ul>
</div>
<div class="col-6 col-md-2 mb-3">
<h5>Section</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">Home</a></li>
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">Features</a></li>
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">Pricing</a></li>
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">FAQs</a></li>
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">About</a></li>
</ul>
</div>
<div class="col-6 col-md-2 mb-3">
<h5>Section</h5>
<ul class="nav flex-column">
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">Home</a></li>
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">Features</a></li>
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">Pricing</a></li>
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">FAQs</a></li>
<li class="nav-item mb-2"><a href="#"
class="nav-link p-0 text-body-secondary">About</a></li>
</ul>
</div>
<div class="col-md-5 offset-md-1 mb-3">
<form>
<h5>Subscribe to our newsletter</h5>
<p>Monthly digest of what's new and exciting from us.</p>
<div class="d-flex flex-column flex-sm-row w-100 gap-2">
<label for="newsletter1" class="visually-hidden">Email address</label>
<input id="newsletter1" type="text"
class="form-control xweb__form-control form-control-lg xweb__form-control-lg"
placeholder="Email address">
<button class="btn xweb__btn btn-primary xweb__btn-primary"
type="button">Subscribe</button>
</div>
</form>
</div>
</div>
<div class="d-flex flex-column flex-sm-row justify-content-between py-4 my-4 border-top">
<p>© 2023 <a class="text-dark text-decoration-none" href="https://www.github.com/kaanxweb"
target="_blank">Kaanxweb</a>, Inc. No rights reserved.</p>
<ul class="list-unstyled d-flex">
<li class="ms-3"><a class="link-body-emphasis" href="#"><svg class="bi" width="24"
height="24">
<use xlink:href="#twitter"></use>
</svg></a></li>
<li class="ms-3"><a class="link-body-emphasis" href="#"><svg class="bi" width="24"
height="24">
<use xlink:href="#instagram"></use>
</svg></a></li>
<li class="ms-3"><a class="link-body-emphasis" href="#"><svg class="bi" width="24"
height="24">
<use xlink:href="#facebook"></use>
</svg></a></li>
</ul>
</div>
</footer>
</div>
</section>
</body>
</html>