Nicholai/nicholai-work-2026
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(nav): add gitea profile link to navigation

Browse Source 
add external link to git.nicholai.work/Nicholai with git-branch icon
This commit is contained in:
Nicholai Vogel 2026-01-20 11:53:14 -07:00
parent fc4af6f15e
commit cc639ea63d
1 changed files with 21 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/components/Navigation.astro
View File

@ -9,6 +9,7 @@ const navItems = [
{ href: '/dev', label: 'Dev', icon: 'code' }, { href: '/dev', label: 'Dev', icon: 'code' },
{ href: '/blog', label: 'Blog', icon: 'file' }, { href: '/blog', label: 'Blog', icon: 'file' },
// { href: '/hubert', label: 'Hubert', icon: 'chat' }, // temporarily disabled // { href: '/hubert', label: 'Hubert', icon: 'chat' }, // temporarily disabled
{ href: 'https://git.nicholai.work/Nicholai', label: 'Git', icon: 'git', external: true },
{ href: '/contact', label: 'Contact', icon: 'mail' }, { href: '/contact', label: 'Contact', icon: 'mail' },
]; ];
@ -34,6 +35,7 @@ function isActive(href: string): boolean {
]} ]}
aria-label={item.label} aria-label={item.label}
data-icon={item.icon} data-icon={item.icon}
{...(item.external ? { target: "_blank", rel: "noopener noreferrer" } : {})}
> >
{/* Home icon */} {/* Home icon */}
{item.icon === 'home' && ( {item.icon === 'home' && (
@ -72,6 +74,15 @@ function isActive(href: string): boolean {
<polyline points="22,6 12,13 2,6"></polyline> <polyline points="22,6 12,13 2,6"></polyline>
</svg> </svg>
)} )}
{/* Git icon */}
{item.icon === 'git' && (
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
<line x1="6" y1="3" x2="6" y2="15"></line>
<circle cx="18" cy="6" r="3"></circle>
<circle cx="6" cy="18" r="3"></circle>
<path d="M18 9a9 9 0 0 1-9 9"></path>
</svg>
)}
{/* Tooltip */} {/* Tooltip */}
<span class="absolute left-full ml-3 px-3 py-1.5 bg-[var(--theme-bg-secondary)] border border-[var(--theme-border-primary)] rounded-lg text-xs font-medium whitespace-nowrap opacity-0 pointer-events-none group-hover:opacity-100 transition-opacity duration-200 shadow-lg"> <span class="absolute left-full ml-3 px-3 py-1.5 bg-[var(--theme-bg-secondary)] border border-[var(--theme-border-primary)] rounded-lg text-xs font-medium whitespace-nowrap opacity-0 pointer-events-none group-hover:opacity-100 transition-opacity duration-200 shadow-lg">
{item.label} {item.label}
@ -122,6 +133,7 @@ function isActive(href: string): boolean {
? "bg-brand-accent/10 text-brand-accent" ? "bg-brand-accent/10 text-brand-accent"
: "text-[var(--theme-text-muted)] hover:text-[var(--theme-text-primary)] hover:bg-[var(--theme-hover-bg-strong)]" : "text-[var(--theme-text-muted)] hover:text-[var(--theme-text-primary)] hover:bg-[var(--theme-hover-bg-strong)]"
]} ]}
{...(item.external ? { target: "_blank", rel: "noopener noreferrer" } : {})}
> >
{/* Home icon */} {/* Home icon */}
{item.icon === 'home' && ( {item.icon === 'home' && (
@ -160,6 +172,15 @@ function isActive(href: string): boolean {
<polyline points="22,6 12,13 2,6"></polyline> <polyline points="22,6 12,13 2,6"></polyline>
</svg> </svg>
)} )}
{/* Git icon */}
{item.icon === 'git' && (
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
<line x1="6" y1="3" x2="6" y2="15"></line>
<circle cx="18" cy="6" r="3"></circle>
<circle cx="6" cy="18" r="3"></circle>
<path d="M18 9a9 9 0 0 1-9 9"></path>
</svg>
)}
<span class="text-base font-medium uppercase tracking-wider">{item.label}</span> <span class="text-base font-medium uppercase tracking-wider">{item.label}</span>
</a> </a>