mirror of
https://github.com/Memo-2023/mana-monorepo.git
synced 2026-05-23 22:16:43 +02:00
- Move finance, mail, moodlit to apps-archived for later development - Rename games/voxel-lava to games/voxelava 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
101 lines
2.8 KiB
Text
101 lines
2.8 KiB
Text
---
|
|
const navLinks = [
|
|
{ href: '#features', label: 'Features' },
|
|
{ href: '#how-it-works', label: "So funktioniert's" },
|
|
{ href: '#pricing', label: 'Preise' },
|
|
{ href: '#faq', label: 'FAQ' },
|
|
];
|
|
---
|
|
|
|
<nav
|
|
class="fixed top-0 left-0 right-0 z-50 bg-background-page/80 backdrop-blur-lg border-b border-border"
|
|
>
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="flex items-center justify-between h-16">
|
|
<!-- Logo -->
|
|
<a href="/" class="flex items-center gap-2">
|
|
<svg
|
|
class="w-8 h-8 text-primary"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
stroke-width="1.5"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75"
|
|
></path>
|
|
</svg>
|
|
<span class="font-bold text-xl text-text-primary">ManaMail</span>
|
|
</a>
|
|
|
|
<!-- Desktop Navigation -->
|
|
<div class="hidden md:flex items-center gap-8">
|
|
{
|
|
navLinks.map((link) => (
|
|
<a
|
|
href={link.href}
|
|
class="text-text-secondary hover:text-text-primary transition-colors text-sm font-medium"
|
|
>
|
|
{link.label}
|
|
</a>
|
|
))
|
|
}
|
|
</div>
|
|
|
|
<!-- CTA Button -->
|
|
<div class="flex items-center gap-4">
|
|
<a href="#download" class="btn-primary text-sm px-4 py-2"> App herunterladen </a>
|
|
|
|
<!-- Mobile Menu Button -->
|
|
<button
|
|
type="button"
|
|
class="md:hidden p-2 text-text-secondary hover:text-text-primary"
|
|
aria-label="Menu"
|
|
id="mobile-menu-button"
|
|
>
|
|
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M4 6h16M4 12h16M4 18h16"></path>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Mobile Menu -->
|
|
<div class="hidden md:hidden" id="mobile-menu">
|
|
<div class="px-4 py-4 space-y-2 bg-background-card border-t border-border">
|
|
{
|
|
navLinks.map((link) => (
|
|
<a
|
|
href={link.href}
|
|
class="block px-4 py-2 text-text-secondary hover:text-text-primary hover:bg-background-card-hover rounded-lg transition-colors"
|
|
>
|
|
{link.label}
|
|
</a>
|
|
))
|
|
}
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<script>
|
|
const mobileMenuButton = document.getElementById('mobile-menu-button');
|
|
const mobileMenu = document.getElementById('mobile-menu');
|
|
|
|
mobileMenuButton?.addEventListener('click', () => {
|
|
mobileMenu?.classList.toggle('hidden');
|
|
});
|
|
|
|
// Close menu when clicking a link
|
|
mobileMenu?.querySelectorAll('a').forEach((link) => {
|
|
link.addEventListener('click', () => {
|
|
mobileMenu?.classList.add('hidden');
|
|
});
|
|
});
|
|
</script>
|