z0x/blog.z0x.ca
Code Actions

feat: typography, toc

Browse source
This commit is contained in:
enscribe 2024-09-10 16:41:01 -07:00
parent ea68d4f02f
commit 8fe228e243
No known key found for this signature in database
GPG key ID: 9BBD5C4114E25322
16 changed files with 194 additions and 311 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/components/Header.astro
View file

@ -11,21 +11,23 @@ const items = [
]
---
<header class="sticky top-0 z-10" transition:persist>
<header class="sticky top-0 z-10 bg-background/50 backdrop-blur-md" transition:persist>
<Container>
<div class="flex items-center justify-between py-4">
<Link href="/" underline={false}>
{SITE.TITLE}<span class="ml-1">🍄</span>
<Link href="/" class="text-xl font-semibold hover:text-primary transition-colors duration-300">
{SITE.TITLE}
</Link>
<nav class="flex items-center space-x-1 text-sm">
{
items.map((item, index) => (
<>
<Link href={item.href}>{item.label}</Link>
{index < items.length - 1 && <span class="text-gray-400">/</span>}
</>
))
}
<nav class="flex items-center gap-4 md:gap-6 text-sm">
{items.map((item, index) => (
<Fragment key={item.href}>
<Link
href={item.href}
class="transition-colors hover:text-foreground/80 text-foreground/60 capitalize"
>
{item.label}
</Link>
</Fragment>
))}
</nav>
</div>
</Container>