Top nav buttons

UI improvement: Top nav buttons now show "active" when user is on their respective page.
This commit is contained in:
ehpersonal38
2022-04-21 08:13:41 -04:00
parent 91d5295f65
commit 9756dc9b2a
2 changed files with 19 additions and 0 deletions
+5
View File
@@ -158,6 +158,11 @@ button:hover {
color: white; color: white;
} }
.topnav .button-hover {
background-color: rgb(219, 295, 235) !important;
color: black;
}
.topnav .icon { .topnav .icon {
display: none; display: none;
} }
+14
View File
@@ -30,6 +30,20 @@
</form> </form>
<button href="javascript:void(0);" class="icon" onclick="myFunction()"><img src="images/menu.png"></button> <button href="javascript:void(0);" class="icon" onclick="myFunction()"><img src="images/menu.png"></button>
</div> </div>
<script>
var topbuttons = document.querySelectorAll("button[form='views']");
if(window.location.search.substr(1) != '') {
for (var i = 0; i < topbuttons.length; i++) {
if(topbuttons[i].value == decodeURIComponent(window.location.search.substr(1)).replace(/\+/g,' ').split('=').pop()) {
topbuttons[i].classList.add("button-hover");
}
}
} else {
topbuttons[0].classList.add("button-hover");
}
</script>
<div class="views"> <div class="views">
<?php <?php
if(isset($_GET['view'])){ if(isset($_GET['view'])){