58 lines
2.8 KiB
TypeScript
58 lines
2.8 KiB
TypeScript
import Link from 'next/link';
|
|
|
|
export default function Header() {
|
|
return (
|
|
<header className="w-full bg-linear-to-r from-[#003366] via-[#004B87] to-[#003366] border-b border-[#00B4D8]/40 shadow-lg">
|
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div className="flex justify-between items-center h-20">
|
|
{/* Logo - Sol taraf */}
|
|
<div className="shrink-0">
|
|
<Link href="/" className="flex items-center space-x-3">
|
|
<div className="text-[#00B4D8]">
|
|
<svg className="w-12 h-12" viewBox="0 0 50 50" fill="currentColor">
|
|
<path d="M25 5L5 15v20l20 10 20-10V15L25 5zm0 3.5L42 18v14l-17 8.5L8 32V18l17-9.5z"/>
|
|
<path d="M25 15l-10 5v10l10 5 10-5V20l-10-5zm0 3l7 3.5v7L25 32l-7-3.5v-7l7-3.5z"/>
|
|
</svg>
|
|
</div>
|
|
<div className="flex flex-col">
|
|
<span className="text-[#48CAE4] text-sm font-semibold uppercase tracking-wider">Ankara</span>
|
|
<span className="text-white text-xl font-bold">Büyükşehir Belediyesi</span>
|
|
</div>
|
|
</Link>
|
|
</div>
|
|
|
|
{/* Sağ taraf - Dil, Hava Durumu, Arama ve Menü */}
|
|
<div className="flex items-center space-x-4">
|
|
{/* Dil seçimi */}
|
|
<button className="text-white text-sm font-semibold hover:text-[#48CAE4] transition-colors">
|
|
TR
|
|
</button>
|
|
|
|
{/* Hava durumu */}
|
|
<div className="flex items-center space-x-2 text-white">
|
|
<svg className="w-6 h-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M3 15a4 4 0 004 4h9a5 5 0 10-.1-9.999 5.002 5.002 0 10-9.78 2.096A4.001 4.001 0 003 15z" />
|
|
</svg>
|
|
<span className="text-sm font-medium">10°C</span>
|
|
</div>
|
|
|
|
{/* Arama butonu */}
|
|
<button className="p-2 rounded-full border-2 border-white text-white hover:bg-[#00B4D8] hover:border-[#00B4D8] transition-colors">
|
|
<svg className="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
|
|
</svg>
|
|
</button>
|
|
|
|
{/* Menü butonu */}
|
|
<button className="p-3 rounded-lg bg-[#00B4D8] text-white hover:bg-[#48CAE4] transition-colors shadow-lg">
|
|
<svg className="w-6 h-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 6h16M4 12h16M4 18h16" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|