Rename HeaderLink component to NavLink

This commit is contained in:
Maciej Pędzich 2023-05-13 06:38:06 +02:00
parent 9376546f3d
commit 59ec87be3c
3 changed files with 19 additions and 29 deletions

View File

@ -1,5 +1,5 @@
--- ---
import HeaderLink from './HeaderLink.astro'; import NavLink from './NavLink.astro';
--- ---
<header> <header>
@ -8,38 +8,17 @@ import HeaderLink from './HeaderLink.astro';
<span>Pędzich</span> <span>Pędzich</span>
</span> </span>
<nav class="cmr2-text" aria-label="Site navigation"> <nav class="cmr2-text" aria-label="Site navigation">
<HeaderLink href="/">Home</HeaderLink> <NavLink href="/">Home</NavLink>
<HeaderLink href="/blog">Blog</HeaderLink> <NavLink href="/blog">Blog</NavLink>
<HeaderLink href="/projects">Projects</HeaderLink> <NavLink href="/projects">Projects</NavLink>
<HeaderLink href="/resume.pdf">Resume</HeaderLink> <NavLink href="/resume.pdf">Resume</NavLink>
<HeaderLink href="/uses">Setup</HeaderLink> <NavLink href="/uses">Setup</NavLink>
<HeaderLink href="/links">Links</HeaderLink> <NavLink href="/links">Links</NavLink>
<HeaderLink href="mailto:contact@maciejpedzi.ch">Email me</HeaderLink> <NavLink href="mailto:contact@maciejpedzi.ch">Email me</NavLink>
</nav> </nav>
</header> </header>
<style> <style>
@media only screen and (max-width: 625px) {
nav.cmr2-text {
justify-content: left;
}
}
nav.cmr2-text {
line-height: 1.5;
flex-wrap: nowrap;
overflow-x: auto;
}
nav > a {
color: rgba(255, 255, 255, 0.4);
text-decoration: none;
}
header {
margin: 0em 0 2em;
}
h2 { h2 {
margin: 0.5em 0; margin: 0.5em 0;
} }

View File

@ -1,6 +1,7 @@
--- ---
import BaseLayout from '../../layouts/BaseLayout.astro'; import BaseLayout from '../../layouts/BaseLayout.astro';
import PostList from '../../components/PostList.astro'; import PostList from '../../components/PostList.astro';
import NavLink from '../../components/NavLink.astro';
--- ---
<BaseLayout <BaseLayout
@ -9,6 +10,12 @@ import PostList from '../../components/PostList.astro';
> >
<section> <section>
<h2>My blog</h2> <h2>My blog</h2>
<nav class="cmr2-text" aria-label="">
<NavLink href="/blog">recent posts</NavLink>
<NavLink href="/blog/categories">categories</NavLink>
<NavLink href="/blog/tags">tags</NavLink>
<NavLink href="/blog/archive">archive</NavLink>
</nav>
<PostList /> <PostList />
</section> </section>
</BaseLayout> </BaseLayout>
@ -17,4 +24,8 @@ import PostList from '../../components/PostList.astro';
section { section {
text-align: center; text-align: center;
} }
section > h2 {
margin-bottom: 0.5em;
}
</style> </style>