51 lines
1.9 KiB
TypeScript
51 lines
1.9 KiB
TypeScript
import { Button } from "@/components/ui/button";
|
|
import { Input } from "@/components/ui/input";
|
|
import { Search } from "lucide-react";
|
|
import logo from "@/assets/businessportal.svg";
|
|
import { BurgerMenu } from "@/components/BurgerMenu";
|
|
|
|
export function Header() {
|
|
return (
|
|
<header className="sticky top-0 z-50 bg-card border-b border-border/50 shadow-sm backdrop-blur-sm">
|
|
{/* Brand Accent Bar */}
|
|
<div className="h-1 bg-gradient-to-r from-primary via-secondary to-primary"></div>
|
|
|
|
<div className="container mx-auto px-4 h-16 flex items-center justify-between gap-4">
|
|
{/* Burger Menu + Logo */}
|
|
<div className="flex items-center gap-2">
|
|
<BurgerMenu />
|
|
<a href="/" className="flex-shrink-0">
|
|
<img src={logo} alt="Business Portal" className="h-10 w-auto" />
|
|
</a>
|
|
</div>
|
|
|
|
{/* Search - Desktop */}
|
|
<div className="hidden md:flex flex-1 max-w-xl">
|
|
<div className="relative w-full">
|
|
<Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
|
|
<Input
|
|
type="search"
|
|
placeholder="Pressemitteilungen durchsuchen..."
|
|
className="pl-10 w-full"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Search Icon - Mobile */}
|
|
<button className="md:hidden p-2 hover:bg-muted rounded-lg transition-colors">
|
|
<Search className="h-5 w-5 text-foreground" />
|
|
</button>
|
|
|
|
{/* CTA Buttons */}
|
|
<div className="flex items-center gap-2">
|
|
<Button variant="ghost" className="hidden sm:inline-flex">
|
|
Anmelden
|
|
</Button>
|
|
<Button className="bg-gradient-to-r from-primary to-secondary hover:from-primary/90 hover:to-secondary/90 shadow-md">
|
|
Veröffentlichen
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|