UI/html/admin-side/all-announcements.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>All announcements</title>
</head>
<body>
<!-- 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"><a href="signin.html">Logout</a></li>
</ul>
</div>
</div>
</div>
<!-- HEADER FOR BIG SCREENS-->
<!-- Heading and navbar -->
<div class="container profile-heading heigth-100">
<head>
<div class="text-50 text-bold expl-to-do">
<a href="../index.html">
<span class="announce-brand">Announce</span><span class="it-brand">IT</span>
</a>
</div>
<nav>
<ul>
<li>
<a href="../create-announcement.html">Create announcement</a>
</li>
<li>
<a href="admin-page.html">Profile</a>
</li>
<li>
<a href="#">Help</a>
</li>
<li>
<a href="#">Settings</a>
</li>
<li>
<a href="../signin.html">Logout</a>
</li>
</ul>
</nav>
</head>
</div>
<div
class="width-60 shadows-black rounded-corner-30 dark-bordered-1 margin-top-2">
<input
type="text"
placeholder="Search announcement by status or id. Eg:Accepted or 3"
id="searching-bar"
class="width-100 white-bordered-1-bottom text-17 text-black rounded-corner-30 text-center"
>
</div>
<!-- Displaying list of announcements -->
<div class="container centered-element-h">
<div class="margin-top-2 margin-bottom-2 bg-white width-80" id="announcements-display">
</div>
</div>
<!-- Displaying details of announcement-->
<div
class="width-80 margin-top-2 dark-bordered-1 bg-white padding-top-2 rounded-corner-15 padding-bottom-2 hidden-element"
id="announcement-details-display">
<div class="width-100">
<h2 id="announcement-title" class="text-center"></h2>
<div class="bg-dark-transparent padding-2">
<div class="width-80">
<h3>Content</h3>
<span id="announcement-content"/>
</div>
<div class="container width-80 margin-top-2">
<span class="width-40">Status : </span>
<span class="width-40" id="announcement-status"/>
</div>
<div class="container width-80 margin-top-2">
<span class="width-40">Posted by : </span>
<span class="width-40" id="announcement-owner"/>
</div>
<div class="container width-80 margin-top-2">
<span class="width-40" id="announcement-startdate"/>
<span class="width-40" id="announcement-enddate"/>
</div>
</div>
<div class="width-100 container margin-top-2">
<button class="width-20 bg-blue rounded-corner-30 hand-cursor" announcement-update-btn>
Update</button>
<button
class="width-20 bg-green rounded-corner-30 hand-cursor" id="goback-to-list-btn">
Go back to list</button>
<button
class="width-20 bg-red rounded-corner-30 hand-cursor" announcement-delete-btn>
Delete</button>
</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>
<!-- Importing javascripts-->
<script src="../../js/display-announcement.js" type="module"></script>
<script src="../../js/search-announcement.js" type="module"></script>
<script src="../../js/handle-announcement-clicked.js" type="module"></script>
<script type="module" src="../../js/responsive-navbar.js"></script>
</body>
</html>