UI/html/admin-side/admin-page.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="../../css/announceit-styles.css">
<link rel="stylesheet" href="../../css/font-awesome/css/font-awesome.min.css">
<title>Admin dashboard</title>
</head>
<body>
<div>
<!-- HEADER FOR SMALL SCREENS -->
<div class="header-small-screens width-100 bg-purple">
<div class="width-100">
<div class="text-50 text-bold expl-to-do text-center header-logo-sm bg-purple-dark padding-2">
<a href="index.html">
<span class="announce-brand">Announce</span><span class="it-brand">IT</span>
</a>
<span class="hand-cursor position-right" id="toggler">
<i class="fa fa-bars menu"></i>
</span>
</div>
<!--Menu-->
<div class="text-50 width-80 hidden-element" id="menu-small-screens">
<ul class="text-center container-vertical">
<li class="margin-top-5"><a href="create-announcement.html">Create announcement</a></li>
<li class="margin-top-5">
<!-- search bar -->
<div class="search-bar-div rounded-corner-30 dark-bordered-1 margin-top-1">
<input
type="text"
placeholder="Search announcement by id, status, or announcement title. Eg:Accepted, or 1, ..."
id="searching-bar"
class="width-100 bg-white text-17 shadows-black text-black rounded-corner-30 text-center padding-left-2 padding-right-2"
>
</div>
</li>
<li class="margin-top-5"><a href="signin.html">Logout</a></li>
</ul>
</div>
</div>
</div>
<!-- HEDER FOR BIG SCREENS-->
<!-- Heading and navbar -->
<div class="container profile-heading heigth-200">
<head>
<div class="text-50 text-bold expl-to-do">
<a href="../index.html" class="text-50">
<span class="announce-brand">Announce</span><span class="it-brand">IT</span>
</a>
</div>
<!-- search bar -->
<div class="search-bar-div rounded-corner-30 dark-bordered-1 margin-top-1">
<input
type="text"
placeholder="Search all announcements with status or id or name of announcement. Eg:Accepted"
class="width-100 bg-white text-17 text-black rounded-corner-30 text-center padding-left-2 padding-right-2"
id="searching-bar"
/>
</div>
<!-- nav menu -->
<nav>
<ul>
<li>
<a href="../create-announcement.html">Create announcement</a>
</li>
<li>
<a href="../signin.html">Logout</a>
</li>
</ul>
</nav>
</head>
</div>
<div class="width-90">
<div class="container">
<!-- Profile details -->
<div
class="container-vertical profile-details bg-white dark-bordered-1 rounded-corner-15 padding-10 margin-bottom-5">
<!-- admin card -->
<div class="bg-dark-transparent padding-2 rounded-corner-15">
<div>
<img src="../../img/default-admin-avatar.png"
alt="profile picture" class="default-pp circled-element">
</div>
<div class="text-blue-light bg-dark padding-5 rounded-corner-15">
<span>descholar</span><br/>
<span>emmamugira@gmail.com</span>
</div>
</div>
<div
class="profile-statistics white-bordered-1 margin-top-5 padding-5 rounded-corner-15 bg-dark-transparent text-17 shadows-black">
<p class="option-admin rounded-corner-15 padding-2">
<a href="#">All users</a>
</p>
<p class="option-admin rounded-corner-15 padding-2">
<a href="all-announcements.html">All announcements</a>
</p>
<p class="option-admin rounded-corner-15 padding-2">
<a href="#">All Accepted announcements</a href="all-announcements.html">
</p>
<p class="option-admin rounded-corner-15 padding-2">
<a href="#">All active announcements</a>
</p>
<p class="option-admin rounded-corner-15 padding-2">
<a href="#">All deactivated announcements</a>
</p>
</div>
</div>
<!-- Dashboard -->
<div class="list bg-white rounded-corner-15 shadows-black container-vertical">
<!-- First row -->
<div class="container padding-10">
<a
href="all-announcements.html"
class="rounded-corner-15 height-50 margin-2 bg-blue hand-cursor padding-2 text-center shadows-black option-admin">
<h2>
17
</h2>
<span>
My announcements
</span>
</a>
<a
href="#"
class="rounded-corner-15 height-50 margin-2 bg-green hand-cursor padding-2 text-center shadows-black option-admin">
<h2>
22
</h2>
Edited announcements
</a>
<div class="rounded-corner-15 height-50 margin-2 bg-red hand-cursor padding-2 text-center shadows-black option-admin">
<h2>
45
</h2>
<span>
Announcements I accepted
</span>
</div>
<div class="rounded-corner-15 height-50 margin-2 bg-purple hand-cursor padding-2 text-center shadows-black option-admin">
<h2>.</h2>
<span>
Add user to blacklist
</span>
</div>
</div>
<!-- Second row -->
<div class="container padding-10">
<div class="rounded-corner-15 height-50 margin-2 bg-blue hand-cursor padding-2 text-center shadows-black option-admin">
<h2>
234
</h2>
<span>
All Users
</span>
</div>
<a href="all-announcements.html" class="rounded-corner-15 height-50 margin-2 bg-green hand-cursor padding-2 text-center shadows-black option-admin">
<h2>
106
</h2>
All announcements
</a>
<div class="rounded-corner-15 height-50 margin-2 bg-red hand-cursor padding-2 text-center shadows-black option-admin">
<h2>
.
</h2>
<span>
Delete announcements
</span>
</div>
<div class="rounded-corner-15 height-50 margin-2 bg-purple hand-cursor padding-2 text-center shadows-black option-admin">
<h2>
10
</h2>
<span">
Announcements I deactivated
</span>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Footer -->
<footer class="text-center margin-top-1">
<div class="container centered-element-h">
<span>AnnounceIT</span>
<span class="margin-left-5">ⓒ 2020</span>
</div>
</footer>
<script type="module" src="../../js/responsive-navbar.js"></script>
</body>
</html>