fred.boniface
/
athena.fb-infra.uk
Archived
1
0
Fork 0
Code Issues 72 Pull Requests Packages Projects Releases Activity

Potential fix for #23

This commit is contained in:
Fred Boniface 2022-09-21 21:07:49 +01:00
parent 7835c30cec
commit 7577d28885
3 changed files with 42 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
js/nav.js
View File

@ -1,23 +1,8 @@
function openMenu() { function menuFunction() {
document.getElementById("menu").style.display = "block"; var x = document.getElementByID("menu-hidden");
if x.style.display === "block") {
x.style.display = "none";
} else {
x.style.display = "block";
} }
function closeMenu() {
document.getElementById("menu").style.display = "none";
}
function closeAboutPopup() {
document.getElementById("popup-about").style.display = "none";
}
function openAboutPopup() {
document.getElementById("popup-about").style.display = "block";
}
function closeTiplocPopup() {
document.getElementById("popup-tiploc").style.display = "none";
}
function openTiplocPopup() {
document.getElementById("popup-tiploc").style.display = "block";
} }

14
page-blocks/nav-menu.php
View File

@ -1,12 +1,12 @@
<?php <?php
echo '<script src="/js/nav.js" async></script>'; echo '<script src="/js/nav.js" async></script>';
echo '<div id="menu-button" class="menu-button">'; echo '<div class="nav-bar">';
echo '<img onclick="openMenu()" src="/assets/icons/menu.png"></img>'; echo '<a class="menu-active" href="/">Athena</a>';
echo '<div id="menu-hidden">';
echo '<a href="/issue.php">Report Issue</a>';
echo '<a href="/help.php">Help</a>';
echo '</div>'; echo '</div>';
echo '<div id="menu" class="menu">'; echo '<a href="javascript:void(0);" class="menu-icon" onclick="menuFunction()">';
echo '<a href="/" class="menuitem" onclick="closeMenu()"">Home</a>'; echo '<img src="/assets/icons/menu.png"></img>';
echo '<a href="/issue.php" class="menuitem" onclick="closeMenu()"">Report Issue</a>"';
echo '<a href="/help.php" class="menuitem" onclick="closeMenu()"">Help</a>';
echo '<img class="menu-button" onclick="closeMenu()" class="popup-close" src="/assets/icons/close-circle.png"></img>';
echo '</div>'; echo '</div>';

66
styles/style.css
View File

@ -115,56 +115,46 @@ body {
cursor: pointer; cursor: pointer;
} }
.menu { /* Menu Styles */
display: none;
.nav-bar {
overflow: hidden;
background-color: #3c78d8; background-color: #3c78d8;
width: 100%; position: relative;
position: fixed;
top: 0;
left: 0;
padding-top: 10px;
padding-bottom: 10px;
} }
.menu-button { .nav-bar #menu-hidden {
position: absolute; display: none;
background-color: #aac4ee;
border: none;
right: 30px;
cursor: pointer;
} }
.menuitem { .nav-bar a {
display: inline-block; color: white;
width: 100%; padding: 14px 16px;
background-color: #2256aa;
text-decoration: none; text-decoration: none;
color: #f6f5f4; font-size: 17px;
border: none; display: block;
font-size: 16px; /*background-color: #aac4ee;*/
font-weight: bold;
padding: 3px;
padding-left: 8px;
padding-right: 8px;
margin-left: 10px;
margin-right: 10px;
cursor: pointer;
} }
@media only screen and (min-width: 600px) { .nav-bar a.img {
.menuitem { display: block;
min-width: 10%; position: absolute;
max-width: 40%; right: 0;
margin: auto; top: 0;
border-radius: 18px;
font-size: 20px;
}
} }
.menuitem:hover { .nav-bar a:hover {
background-color: #112b55; background-color: #ddd;
color: black;
} }
.menu-active {
background: #04AA6D;
color: white;
}
/* Footer Styles */
footer { footer {
background-color: #7fa7e6; background-color: #7fa7e6;
color: white; color: white;