Felix Brabetz
29 lines
1.8 KiB
Plaintext
29 lines
1.8 KiB
Plaintext
---
|
|
// src/components/Nav.astro
|
|
---
|
|
<!-- Navigation -->
|
|
<nav class="fixed w-full z-50 transition-all duration-300 border-b border-white/5 bg-stone-950/80 backdrop-blur-md">
|
|
<div class="max-w-7xl mx-auto px-6 lg:px-8 h-20 flex items-center justify-between">
|
|
<a href="#" @click.prevent="currentPage = 'main'" class="flex items-center gap-3 group">
|
|
<div class="w-10 h-10 bg-emerald-900/50 rounded-lg flex items-center justify-center text-amber-400 text-lg border border-amber-500/20 group-hover:border-amber-500/50 transition-all shadow-glow">
|
|
<i class="fa-solid fa-compass-drafting"></i>
|
|
</div>
|
|
<div class="flex flex-col">
|
|
<span class="text-lg font-luxury font-bold tracking-wider text-white">Gebrüder Brabetz</span>
|
|
<span class="text-[9px] font-bold text-amber-500 uppercase tracking-[0.3em] -mt-0.5">Garten- & Landschaftsbau</span>
|
|
</div>
|
|
</a>
|
|
|
|
<div class="hidden lg:flex items-center gap-10 text-xs font-semibold uppercase tracking-widest text-stone-400">
|
|
<a href="#standards" class="hover:text-amber-400 transition-colors">Regelwerk</a>
|
|
<a href="#projects" class="hover:text-amber-400 transition-colors">Projekte</a>
|
|
<a href="#competencies" class="hover:text-amber-400 transition-colors">Leistungen</a>
|
|
<a href="#biodiversity" class="hover:text-amber-400 transition-colors">Natur</a>
|
|
<a href="#faq" class="hover:text-amber-400 transition-colors">FAQ</a>
|
|
<button @click="currentPage = 'page-contact'" class="bg-emerald-800 hover:bg-emerald-700 text-white px-5 py-2.5 rounded-lg transition-all shadow-lg text-xs uppercase tracking-wider font-bold border border-emerald-700 hover:border-emerald-600">
|
|
Projekt starten
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</nav>
|