Totally original css and js, totally not "borrowed" from twip-network.org
This commit is contained in:
parent
4c1864d6a1
commit
5ad3c77fa3
@ -1,3 +1,11 @@
|
||||
const toggleButton = document.getElementById("toggle_button")
|
||||
const navLinks = document.getElementById("navsite_list")
|
||||
|
||||
toggleButton.addEventListener('click', () => {
|
||||
navLinks.classList.toggle("active")
|
||||
})
|
||||
|
||||
|
||||
let UserInfo;
|
||||
|
||||
function handleResponse(data, successMessage, failureMessage) {
|
||||
|
@ -131,6 +131,16 @@ ul
|
||||
ul.navpage_list
|
||||
{
|
||||
gap:10px;
|
||||
background-color:var(--third-bg);
|
||||
border:0 solid transparent;
|
||||
display:none;
|
||||
flex-direction:column;
|
||||
margin-top:10px;
|
||||
max-height:0;
|
||||
overflow:hidden;
|
||||
position:relative;
|
||||
transition:max-height .3s ease, border .325s ease;
|
||||
z-index:2;
|
||||
}
|
||||
|
||||
.back
|
||||
@ -158,27 +168,7 @@ ul.navpage_list
|
||||
|
||||
.feature-list-ul ul
|
||||
{
|
||||
margin-left:20px;
|
||||
margin-top:5px;
|
||||
}
|
||||
|
||||
.feature-list-ul
|
||||
{
|
||||
margin:auto;
|
||||
}
|
||||
|
||||
.navpage_list
|
||||
{
|
||||
background-color:var(--third-bg);
|
||||
border:0 solid transparent;
|
||||
display:none;
|
||||
flex-direction:column;
|
||||
margin-top:10px;
|
||||
max-height:0;
|
||||
overflow:hidden;
|
||||
position:relative;
|
||||
transition:max-height .3s ease, border .325s ease;
|
||||
z-index:2;
|
||||
margin: 5px auto auto 20px;
|
||||
}
|
||||
|
||||
.navsite_item
|
||||
@ -202,14 +192,36 @@ ul.navpage_list
|
||||
max-height:0;
|
||||
transition-delay:.1s;
|
||||
}
|
||||
|
||||
.navsite_list
|
||||
#navsite_list
|
||||
{
|
||||
display:flex;
|
||||
flex-direction:row;
|
||||
gap:3.25rem;
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
.toggle-button {
|
||||
display: flex;
|
||||
}
|
||||
#navsite_list {
|
||||
display: none;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.nav-links li {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.nav-links.active {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
nav {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
.status-message
|
||||
{
|
||||
background-color:#dff0d8;
|
||||
|
@ -1,6 +1,7 @@
|
||||
<nav>
|
||||
<div class="logo"><img alt="Adlerka logo" class="standard-logo" width="213" height="50" src="https://www.adlerka.sk/wp-content/uploads/2021/09/Logo_text_Adlerka_modro_cerveno_biele-e1652431356820.png" title="Adlerka"></div>
|
||||
<ul class="navsite_list">
|
||||
<i class="ri-menu-line" id="toggle_button"></i>
|
||||
<ul id="navsite_list">
|
||||
__NAV_PAGES__
|
||||
</ul>
|
||||
</nav>
|
Loading…
Reference in New Issue
Block a user