-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
137 lines (129 loc) · 6.16 KB
/
index.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BDNews24.com</title>
<!-- Bootstrap CDN Link -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
<!-- Custom Css Link Here -->
<link rel="stylesheet" href="./Css/style.css">
<!-- Font Awesome Icon Kit Link Here -->
<script src="https://kit.fontawesome.com/800be1c8ec.js" crossorigin="anonymous"></script>
</head>
<body>
<!-- header section -->
<header>
<!-- navbar section -->
<section class="container">
<!-- navbar 01 -->
<nav class="navbar navbar-expand-lg">
<div class="container-fluid">
<a class="navbar-brand fw-bold" href="#"><span
class="btn btn-primary fs-4 fw-bold py-0">BD</span>News24.com</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 me-auto mb-lg-0">
</ul>
<form class="d-flex ">
<ul class="navbar-nav me-auto mb-lg-0">
<li class="nav-item">
<a class="nav-link fs-6 fw-semibold text-primary active" aria-current="page"
href="#">News</a>
</li>
<li class="nav-item">
<a class="nav-link fs-6 fw-semibold" aria-current="page" href="#">Blog</a>
</li>
<li>
<a aria-current="page" href="#"><img src="./images/Avatar.svg" alt=""></a>
</li>
</ul>
</form>
</div>
</div>
</nav>
<hr>
</section>
</header>
<!-- main section -->
<main>
<section class="container">
<!-- navbar 02 -->
<ul id="categories-container" class="nav justify-content-around mb-4">
</ul>
<!-- Search History Card -->
<div id="totalItemFound" class="card shadow-lg fw-semibold border-0 mb-4">
</div>
<!-- Sort Part -->
<div class="d-flex align-items-center justify-content-between mb-4">
<div class="d-flex align-items-center">
<span class="fw-bold pe-2">Sort By View:</span>
<div class="dropdown">
<a class="btn btn-light shadow-lg fw-semibold border-0 dropdown-toggle" href="#" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
Default
</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="#">Today's Post</a></li>
<li><a class="dropdown-item" href="#">Recent Post</a></li>
<li><a class="dropdown-item" href="#">Most Popular Post</a></li>
</ul>
</div>
</div>
<div>
<a class="btn btn-primary fw-semibold" href="#" role="button">Today's Pick</a>
<a class="btn btn-outline-primary fw-semibold" href="#" role="button">Trending</a>
</div>
</div>
</section>
<!-- Card Section -->
<section id="news-container" class="container mt-4" id="deals">
<!-- News card -->
</section>
<!-- Model Content -->
<section class="container">
<!-- Modal -->
<div class="modal fade" id="newsDetailsModal" tabindex="-1" aria-labelledby="newsDetailsModalLabel"
aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="newsDetailsModalLabel"></h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div id="news-details" class="modal-body">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</section>
<!-- spinner -->
<section id="spinner" class="d-none container">
<div style="height:400px;" class="d-flex justify-content-center align-items-center">
<div class="spinner-border text-success" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
</section>
</main>
<!-- Footer Section -->
<footer class="shadow-lg p-2 bg-body text-dark fixed-bottom mt-5">
<p class="text-center fw-semibold">Copyright 2021 BDNews24.com</p>
</footer>
<!-- Bootstrap Script Link -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa"
crossorigin="anonymous"></script>
<!-- My Created Script Link -->
<script src="./js/newsCategories.js"></script>
</body>
</html>