style: improve hamburger menu icon with cleaner CSS

This commit is contained in:
2025-12-31 00:28:18 +01:00
parent 6c073b3517
commit d5f9f1a843
2 changed files with 33 additions and 11 deletions

View File

@@ -124,22 +124,46 @@ code, kbd {
.menu-toggle {
display: flex;
flex-direction: column;
justify-content: space-around;
width: 28px;
height: 20px;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
background: none;
border: none;
cursor: pointer;
padding: 0;
padding: 4px;
border-radius: var(--border-radius-sm);
}
.hamburger-line {
.menu-toggle:hover {
background: var(--primary-bg-light);
}
.hamburger-icon {
position: relative;
width: 18px;
height: 2px;
background-color: var(--text-color);
border-radius: 1px;
}
.hamburger-icon::before,
.hamburger-icon::after {
content: "";
position: absolute;
left: 0;
width: 100%;
height: 2px;
background-color: var(--text-color);
border-radius: 2px;
transition: all 0.3s ease;
border-radius: 1px;
}
.hamburger-icon::before {
top: -6px;
}
.hamburger-icon::after {
top: 6px;
}
.logo {