purplebored/purplebored.pl
1
0
Fork 1
Code Issues Pull Requests Actions Activity

Added a hamburger menu for the navbar
All checks were successful
Deploy / Deploy website via rsync over SSH (push) Successful in 5s
Details

Browse Source
This commit is contained in:
Alek Nikovich
2025-11-10 23:19:04 +01:00
parent a44530c49c
commit 6470e8daa7
5 changed files with 86 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
assets/css/style.css
View File

@@ -132,6 +132,23 @@ body {
.tor-label { color: #6e2b9e; }
.ygg-label { color: #92ffb3; }
.mobile-nav-toggle {
display: none;
position: fixed;
top: 12px;
right: 12px;
z-index: 50;
background: rgba(60, 26, 77, 0.6);
color: #fff;
font-size: 1.8rem;
border: 1px solid rgba(255, 255, 255, 0.3);
border-radius: 6px;
padding: 4px 10px;
cursor: pointer;
backdrop-filter: blur(6px);
-webkit-backdrop-filter: blur(6px);
}
.footer {
position: relative;
width: 100%;
@@ -372,3 +389,50 @@ a:not(:has(img)):hover { text-decoration: underline; }
font-size: 0.7rem;
}
}
.mobile-nav-toggle {
display: none;
position: fixed;
top: 12px;
right: 12px;
z-index: 50;
background: rgba(60, 26, 77, 0.6);
color: #fff;
font-size: 1.8rem;
border: 1px solid rgba(255, 255, 255, 0.3);
border-radius: 6px;
padding: 4px 10px;
cursor: pointer;
backdrop-filter: blur(6px);
-webkit-backdrop-filter: blur(6px);
}
@media (max-width: 900px) {
.mobile-nav-toggle {
display: block;
}
.navbar {
position: fixed;
right: -100%;
top: 0;
bottom: 0;
width: 200px;
padding-top: 3.5rem;
flex-direction: column;
height: 100vh;
transition: right 0.3s ease;
}
.navbar.open {
right: 0;
}
.navbar ul {
flex-direction: column;
gap: 0;
}
body {
padding-right: 0;
}
}