Gitlab-Migration/rheinsw-mono-repo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve project structure.

Browse Source 
New Project Structure:
  - Created reusable UI components (ServiceCard, AnimatedSection, SectionTitle)
  - Split large components into smaller, focused ones
  - Extracted shared hooks for common functionality
  - Organized constants into separate files

Key Improvements:
  - Hooks: useScrollNavigation, useScrollToSection, useCookieSettings
  - UI Components: Modular components for consistent styling and behavior
  - Constants: Centralized data management (ServicesData, NavigationData)
  - Component Split: Navbar, Hero, and Footer broken into logical sub-components
This commit is contained in:
Thatsaphorn
2025-08-08 19:38:12 +02:00
parent a5d59cbd64
commit d9ff535ac0
20 changed files with 490 additions and 323 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
frontend/components/Navbar/Navbar.tsx
View File

@@ -1,98 +1,21 @@
'use client';
import React from 'react';
import Link from 'next/link';
import {usePathname, useRouter} from 'next/navigation';
import {Button} from '@/components/ui/button';
import {Sheet, SheetContent, SheetTrigger} from '@/components/ui/sheet';
import {Menu} from 'lucide-react';
import {ThemeToggle} from '@/components/theme-toggle';
const navLinks = [
{id: 'services', label: 'Leistungen'},
{id: 'about', label: 'Über uns'},
{id: 'process', label: 'Ablauf'},
{id: 'whyus', label: 'Warum wir'},
{id: 'referral', label: 'Empfehlung'},
{id: 'faq', label: 'FAQ'},
];
import { useScrollNavigation } from '@/hooks/useScrollNavigation';
import { NavLogo } from './NavLogo';
import { DesktopNav } from './DesktopNav';
import { MobileNav } from './MobileNav';
const Navbar = () => {
const pathname = usePathname();
const router = useRouter();
const handleNavClick = (id: string) => {
if (typeof window === 'undefined') return
if (pathname === '/') {
const el = document.getElementById(id)
if (el) {
el.scrollIntoView({behavior: 'smooth', block: 'start'})
}
} else {
localStorage.setItem('scrollToId', id)
router.push('/')
}
}
const { handleNavClick } = useScrollNavigation();
return (
<div className="w-full px-4 sm:px-6 lg:px-8 flex justify-center mt-4 z-50 fixed">
<header
className="bg-background/50 backdrop-blur-md border shadow-lg rounded-xl w-full max-w-screen-xl py-3 px-4 sm:px-6 lg:px-8">
<header className="bg-background/50 backdrop-blur-md border shadow-lg rounded-xl w-full max-w-screen-xl py-3 px-4 sm:px-6 lg:px-8">
<div className="flex items-center justify-between">
<button
onClick={() => handleNavClick('start')}
className="text-xl font-bold cursor-pointer"
>
<span className="text-pink-600">R</span>hein Software
</button>
{/* Desktop nav */}
<nav className="hidden lg:flex items-center gap-6">
{navLinks.map((link) => (
<button
key={link.id}
onClick={() => handleNavClick(link.id)}
className="cursor-pointer text-sm font-medium text-muted-foreground hover:text-primary transition-colors"
>
{link.label}
</button>
))}
<Button asChild>
<Link href="/contact">Kontakt</Link>
</Button>
<ThemeToggle/>
</nav>
{/* Mobile nav */}
<div className="lg:hidden flex items-center gap-3">
<ThemeToggle/>
<Sheet>
<SheetTrigger asChild>
<Button variant="outline" size="icon">
<Menu className="h-5 w-5"/>
</Button>
</SheetTrigger>
<SheetContent side="top" className="pt-10">
<div className="flex flex-col space-y-4 text-center">
{navLinks.map((link) => (
<button
key={link.id}
onClick={() => handleNavClick(link.id)}
className="cursor-pointer text-base font-semibold text-muted-foreground hover:text-primary transition-colors"
>
{link.label}
</button>
))}
<Button asChild className="mt-4 w-full">
<Link href="/contact">Kontakt</Link>
</Button>
</div>
</SheetContent>
</Sheet>
</div>
<NavLogo onLogoClick={() => handleNavClick('start')} />
<DesktopNav onNavClick={handleNavClick} />
<MobileNav onNavClick={handleNavClick} />
</div>
</header>
</div>