sidski/kjelsrud.dev
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

💄 styling Header

Browse source
This commit is contained in:
SindreKjelsrud 2023-08-22 16:01:37 +02:00
parent 034626b1f7
commit fbe080f605
2 changed files with 9 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/components/Header.astro
View file

@ -3,14 +3,16 @@ import HeaderLink from './HeaderLink.astro';
import { SITE_TITLE } from '../consts';
---
<header class="flex justify-center gap-24 mb-12">
<a class="font-bold" href="/">
{SITE_TITLE}
</a>
<header class="flex justify-center gap-64">
<div>
<a class="font-bold" href="/">
{SITE_TITLE}
</a>
</div>
<nav>
<HeaderLink href="/about">about</HeaderLink>
<HeaderLink href="/projects">projects</HeaderLink>
<HeaderLink href="/resume">resume</HeaderLink>
<HeaderLink href="#">projects</HeaderLink>
<HeaderLink href="#">resume</HeaderLink>
<HeaderLink href="/blog">blog</HeaderLink>
</nav>
</header>

2
src/components/HeaderLink.astro
View file

@ -19,6 +19,6 @@ const isActive = href === pathname || href === pathname.replace(/\/$/, '');
}
a.active {
font-weight: bolder;
text-decoration: underline;
border-bottom: 2px solid;
}
</style>