valentineus/popov.link
0
Fork 0
mirror of https://github.com/valentineus/popov.link.git synced 2025-07-04 08:30:27 +03:00
Code Issues Releases Activity

feat: add header component and update blog layout

Browse Source 
- Introduced a new Header component for site navigation.
- Integrated Header into BaseLayout for consistent site structure.
- Updated blog post layout to include the post title in a dedicated section.
- Minor update to README for license clarity.
This commit is contained in:
Valentin Popov
2025-06-10 13:44:56 +00:00
parent dfe9115ac9
commit bb7481670e
4 changed files with 32 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/Header.astro Normal file
View File

@ -0,0 +1,22 @@
<style lang="scss">
@import "../scss/_variables.scss";
header {
padding-bottom: 1rem;
text-align: right;
}
a {
text-decoration: none;
margin-right: 1.5rem;
&:last-child {
margin-right: 0;
}
}
</style>
<header>
<a href="/">Home</a>
<a href="/blog">Blog</a>
</header>

5
src/layouts/BaseLayout.astro
View File

@ -1,6 +1,7 @@
---
import Analytics from "../components/Analytics.astro";
import Head from "../components/Head.astro";
import Header from "../components/Header.astro";
import "../scss/global.scss";
type Props = {
@ -19,6 +20,10 @@ const { description, title } = Astro.props;
<body>
<main>
<section>
<Header />
</section>
<slot />
</main>
<Analytics title={title ?? import.meta.env.DEFAULT_TITLE} />

10
src/pages/blog/[...slug].astro
View File

@ -32,11 +32,13 @@ const formattedDate = dayjs(post.data.pubDate.toString()).format("MMMM DD, YYYY"
<Layout description={post.data.description} title={post.data.title}>
<article>
<section>
<h1>{post.data.title}</h1>
</section>
<section>
<p>
<small>
<a href="/">&lt; Home</a>
<span>&nbsp;•&nbsp;</span>
Posted
<time datetime={post.data.pubDate.toISOString()}>{formattedDate}</time>
by&nbsp;{post.data.author}
@ -46,10 +48,6 @@ const formattedDate = dayjs(post.data.pubDate.toString()).format("MMMM DD, YYYY"
</p>
</section>
<section>
<h1>{post.data.title}</h1>
</section>
<section>
<Content />
</section>