ben7sys/web7sys
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

responsive fix 768 max width header menu

Browse Source
This commit is contained in:
ben7sys
2024-11-15 15:14:35 +01:00
parent b807e527d5
commit f3da66a6e2
2 changed files with 22 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
public/css/header.css
View File

@@ -83,25 +83,3 @@ header {
padding: var(--spacing-sm); padding: var(--spacing-sm);
} }
@media (max-width: 768px) {
.mobile-menu-toggle {
display: block;
}
.nav-menu {
display: none;
position: absolute;
top: var(--header-height);
left: 0;
right: 0;
background: var(--bg-card);
padding: var(--spacing-md);
flex-direction: column;
align-items: center;
border-bottom: 1px solid var(--border-color);
}
.nav-menu.active {
display: flex;
}
}

22
public/css/responsive.css
View File

@@ -46,6 +46,28 @@
margin: 0; margin: 0;
padding: 1.5rem 1.5rem; padding: 1.5rem 1.5rem;
} }
.mobile-menu-toggle {
display: block;
}
.nav-menu {
display: none;
position: absolute;
top: 55px;
left: 0;
right: 0;
background: var(--bg-card);
padding-top: 40px;
padding-bottom: 500px;
flex-direction: column;
align-items: center;
border-bottom: 1px solid var(--border-color);
}
.nav-menu.active {
display: flex;
}
} }
/* Mobile Devices */ /* Mobile Devices */