chore(website): improve header layout on mobile

This commit is contained in:
Elian Doran 2025-09-27 11:55:49 +03:00
parent 8117586548
commit 55c70b404c
No known key found for this signature in database
2 changed files with 15 additions and 3 deletions

View File

@ -7,6 +7,7 @@ header {
backdrop-filter: blur(20px); backdrop-filter: blur(20px);
z-index: 1000; z-index: 1000;
--gap: 1.25em; --gap: 1.25em;
font-size: 0.8em;
} }
header .content-wrapper { header .content-wrapper {
@ -30,8 +31,8 @@ section.hero-section > .content-wrapper {
} }
header img { header img {
width: 48px; width: 32px;
height: 48px; height: 32px;
} }
header img+span { header img+span {
@ -52,4 +53,15 @@ header nav a {
header nav a.active { header nav a.active {
font-weight: bold; font-weight: bold;
}
@media (min-width: 720px) {
header {
font-size: inherit;
}
header img {
width: 48px;
height: 48px;
}
} }

View File

@ -27,7 +27,7 @@ export function Header() {
{HEADER_LINKS.map(link => ( {HEADER_LINKS.map(link => (
<a <a
href={link.url} href={link.url}
className={url === link.url && 'active'} className={url === link.url ? "active" : ""}
target={link.external && "_blank"} target={link.external && "_blank"}
>{link.text}</a> >{link.text}</a>
))} ))}