49 lines
1.7 KiB
Svelte
49 lines
1.7 KiB
Svelte
<script lang="ts">
|
|
import { Button } from '$lib/components/ui/button';
|
|
import { Download, FileText, Info } from 'lucide-svelte';
|
|
</script>
|
|
|
|
<nav class="fixed top-4 left-1/2 transform -translate-x-1/2 z-50 w-full max-w-2xl px-4">
|
|
<div class="bg-background backdrop-blur-xl border border-border/50 rounded-3xl px-6 py-3 shadow-2xl">
|
|
<div class="flex items-center justify-between">
|
|
<!-- Logo and Brand -->
|
|
<a href="/" class="flex items-center space-x-3">
|
|
<div class="w-8 h-8 flex items-center justify-center">
|
|
<img src="/favicon.svg" alt="Gurted Logo" class="w-8 h-8" />
|
|
</div>
|
|
<span class="font-gurted font-bold text-xl text-gurted-gradient">Gurted</span>
|
|
</a>
|
|
|
|
<!-- Navigation Links -->
|
|
<div class="hidden md:flex items-center space-x-1">
|
|
<Button variant="ghost" size="sm" class="text-muted-foreground hover:text-foreground" href="https://docs.gurted.com">
|
|
Docs
|
|
</Button>
|
|
<Button variant="ghost" size="sm" class="text-muted-foreground hover:text-foreground" href="https://github.com/outpoot/gurted">
|
|
GitHub
|
|
</Button>
|
|
<a href="/download">
|
|
<Button size="sm" class="bg-primary hover:bg-primary/90 text-primary-foreground shadow-lg">
|
|
Download
|
|
</Button>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Mobile Menu Button -->
|
|
<div class="md:hidden">
|
|
<a href="/download">
|
|
<Button size="sm" class="bg-primary hover:bg-primary/90 text-primary-foreground">
|
|
<Download class="w-4 h-4" />
|
|
</Button>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<style>
|
|
nav {
|
|
backdrop-filter: blur(20px);
|
|
-webkit-backdrop-filter: blur(20px);
|
|
}
|
|
</style> |