This commit is contained in:
Daniel Brendel
2023-03-25 15:02:04 +01:00
parent c2beb1b45e
commit 5d84d9a100
4 changed files with 24 additions and 6 deletions

View File

@ -29,6 +29,16 @@ window.vue = new Vue({
el.classList.toggle('is-active'); el.classList.toggle('is-active');
$target.classList.toggle('is-active'); $target.classList.toggle('is-active');
if (el.classList.contains('is-active')) {
let rootel = document.getElementsByClassName('navbar')[0];
rootel.classList.add('navbar-purple');
rootel.classList.add('navbar-no-transition');
} else {
let rootel = document.getElementsByClassName('navbar')[0];
rootel.classList.remove('navbar-purple');
rootel.classList.remove('navbar-no-transition');
}
}); });
}); });
} }
@ -230,9 +240,9 @@ document.addEventListener('DOMContentLoaded', function(){
window.onscroll = function() { window.onscroll = function() {
if ((document.body.scrollTop > document.getElementsByClassName('navbar')[0].offsetHeight + 10) || (document.documentElement.scrollTop > document.getElementsByClassName('navbar')[0].offsetHeight + 10)) { if ((document.body.scrollTop > document.getElementsByClassName('navbar')[0].offsetHeight + 10) || (document.documentElement.scrollTop > document.getElementsByClassName('navbar')[0].offsetHeight + 10)) {
document.getElementsByClassName('navbar')[0].classList.add('navbar-background-show'); document.getElementsByClassName('navbar')[0].classList.add('navbar-purple');
} else { } else {
document.getElementsByClassName('navbar')[0].classList.remove('navbar-background-show'); document.getElementsByClassName('navbar')[0].classList.remove('navbar-purple');
} }
}; };

View File

@ -18,12 +18,20 @@ body {
transition: .3s ease-in-out; transition: .3s ease-in-out;
} }
.navbar-no-transition {
transition: unset;
}
.navbar-item-brand img { .navbar-item-brand img {
border-radius: 50%; border-radius: 50%;
} }
.navbar-background-show { .navbar-purple {
background-color: rgb(76, 76, 120); background-color: rgb(76, 76, 120) !important;
}
.navbar-menu {
background-color: rgb(76, 76, 120) !important;
} }
a.navbar-item:hover, a.navbar-item.is-active, .navbar-link:hover, .navbar-link.is-active { a.navbar-item:hover, a.navbar-item.is-active, .navbar-link:hover, .navbar-link.is-active {

View File

@ -11,7 +11,7 @@
</a> </a>
</div> </div>
<div id="navbarBasicExample" class="navbar-menu"> <div id="navbarBasicExample" class="navbar-menu navbar-purple">
<div class="navbar-start"> <div class="navbar-start">
<a class="navbar-item" href="{{ url('/documentation') }}"> <a class="navbar-item" href="{{ url('/documentation') }}">
Documentation Documentation

File diff suppressed because one or more lines are too long