atash/atashdotdev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Maybe this helps?
All checks were successful
Docker Deploy / build-and-push (push) Successful in 3m24s
Details

Browse Source
This commit is contained in:
Atridad Lahiji
2026-01-01 13:33:10 -07:00
parent 91e1be00f5
commit f5a8a2e5b4
5 changed files with 51 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
src/components/Header.astro
View File

@@ -1,13 +1,22 @@
---
import { siteConfig } from "../config/site";
import { Icon } from "astro-icon/components";
import { Image } from "astro:assets";
---
<header class="sticky top-0 z-50 backdrop-blur-lg bg-base-100/80 border-b border-base-200" role="banner">
<header
class="sticky top-0 z-50 backdrop-blur-lg bg-base-100/80 border-b border-base-200"
role="banner"
>
<div class="navbar max-w-7xl mx-auto px-4 lg:px-6">
<div class="navbar-start">
<div class="dropdown">
<div tabindex="0" role="button" class="btn btn-ghost btn-circle lg:hidden" aria-label="Open menu">
<div
tabindex="0"
role="button"
class="btn btn-ghost btn-circle lg:hidden"
aria-label="Open menu"
>
<Icon name="heroicons:bars-3-bottom-left" class="h-5 w-5" />
</div>
<ul
@@ -18,7 +27,11 @@ import { Icon } from "astro-icon/components";
{
siteConfig.header.nav.map(({ text, href }) => (
<li role="none">
<a href={href} role="menuitem" class="py-3 px-4 rounded-lg font-medium hover:bg-primary/10 hover:text-primary transition-colors">
<a
href={href}
role="menuitem"
class="py-3 px-4 rounded-lg font-medium hover:bg-primary/10 hover:text-primary transition-colors"
>
{text}
</a>
</li>
@@ -31,9 +44,19 @@ import { Icon } from "astro-icon/components";
class="btn btn-ghost text-xl font-bold tracking-tight hover:bg-transparent hover:text-primary transition-colors gap-2"
aria-label="Home"
>
<img src="/logo.svg" alt="" width="32" height="32" class="h-8 w-8" aria-hidden="true" />
<span class="hidden sm:inline">{siteConfig.header.logo.text}</span>
<span class="sm:hidden">{siteConfig.header.mobileLogoText}</span>
<Image
src="/logo.svg"
alt=""
width="32"
height="32"
class="h-8 w-8"
aria-hidden="true"
/>
<span class="hidden sm:inline"
>{siteConfig.header.logo.text}</span
>
<span class="sm:hidden">{siteConfig.header.mobileLogoText}</span
>
</a>
</div>
<nav class="navbar-center hidden lg:flex" aria-label="Main navigation">
@@ -41,7 +64,11 @@ import { Icon } from "astro-icon/components";
{
siteConfig.header.nav.map(({ text, href }) => (
<li role="none">
<a href={href} role="menuitem" class="font-medium px-4 py-2 rounded-lg hover:bg-primary/10 hover:text-primary transition-colors">
<a
href={href}
role="menuitem"
class="font-medium px-4 py-2 rounded-lg hover:bg-primary/10 hover:text-primary transition-colors"
>
{text}
</a>
</li>