fix: add mobile menu to projects view and CSS

This commit is contained in:
Hiro
2026-03-28 14:20:07 +00:00
parent 4e1d4f80cc
commit fffb3c1b29
2 changed files with 81 additions and 0 deletions

View File

@@ -1959,3 +1959,63 @@ ul, ol {
height: 28px;
font-size: 0.875rem;
}
/* === Mobile Menu === */
.mobile-menu {
display: none;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: var(--color-bg);
z-index: 1000;
padding: var(--space-4);
}
.mobile-menu.open {
display: block;
}
.mobile-menu-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: var(--space-4);
padding-bottom: var(--space-4);
border-bottom: 1px solid var(--color-border);
}
.mobile-menu-header span {
font-weight: 600;
font-size: 1.125rem;
}
.mobile-menu-content {
display: flex;
flex-direction: column;
gap: var(--space-2);
}
.mobile-menu-content a {
display: block;
padding: var(--space-3);
background: var(--color-bg-secondary);
border-radius: var(--radius-md);
color: var(--color-text);
text-decoration: none;
font-size: 1rem;
}
.mobile-menu-content a:active {
background: var(--color-bg-tertiary);
}
@media (max-width: 768px) {
.mobile-menu {
display: none;
}
.mobile-menu.open {
display: block;
}
}