ayrisdev/kitebeachakyaka
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI: Refactor all page headers to minimal text layout without hero images and fix overlapping with navbar

Browse Source
This commit is contained in:
Ayris Dev
2026-07-15 14:31:56 +03:00
parent 7a874ab11d
commit f78fb90a55
6 changed files with 63 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/[lang]/hakkimizda/page.tsx
+13 -26
View File
@@ -75,32 +75,19 @@ export default async function HakkimizdaPage({ params }: { params: Promise<{ lan
const displayStats = isEn ? statsEn : statsTr;
return (
<div className="min-h-screen bg-background">
<div className="min-h-screen bg-background pt-40 pb-10">
{/* Page Header */}
<section className="relative h-[55vh] w-full flex items-end overflow-hidden">
<div className="absolute inset-0">
<Image
src="https://images.unsplash.com/photo-1544551763-46a013bb70d5?q=80&w=2940&auto=format&fit=crop"
alt={isEn ? "About Us" : "Hakkımızda"}
fill
sizes="100vw"
className="object-cover"
/>
<div className="absolute inset-0 bg-gradient-to-t from-dark/85 via-dark/30 to-black/20" />
</div>
<div className="relative z-10 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pb-14 w-full">
<span className="block text-accent text-xs tracking-[0.3em] uppercase font-semibold mb-3 animate-fade-up">
{isEn ? "Who We Are" : "Biz Kimiz"}
</span>
<h1 className="font-serif text-5xl md:text-7xl text-white font-bold animate-fade-up delay-100">
{isEn ? "Our Story" : "Hikayemiz"}
</h1>
<p className="text-white/60 text-lg mt-3 font-light animate-fade-up delay-200">
{isEn ? "Where the wind, sea and river meet." : "Rüzgarın, denizin ve nehrin kesiştiği yerde."}
</p>
</div>
</section>
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center mb-16">
<span className="inline-block text-accent text-xs tracking-[0.25em] uppercase font-semibold mb-4 animate-fade-up">
{isEn ? "Who We Are" : "Biz Kimiz"}
</span>
<h1 className="font-serif text-5xl md:text-6xl text-dark font-bold animate-fade-up delay-100 mb-6">
{isEn ? "Our Story" : "Hikayemiz"}
</h1>
<p className="text-muted text-lg max-w-2xl mx-auto animate-fade-up delay-200">
{isEn ? "Where the wind, sea and river meet." : "Rüzgarın, denizin ve nehrin kesiştiği yerde."}
</p>
</div>
{/* Story */}
<section className="py-24 bg-white">
@@ -134,7 +121,7 @@ export default async function HakkimizdaPage({ params }: { params: Promise<{ lan
<ScrollReveal delay={150}>
<div className="relative h-[460px] rounded-3xl overflow-hidden">
<Image
src="https://images.unsplash.com/photo-1526367790999-0150786686a2?q=80&w=2940&auto=format&fit=crop"
src="/kitesurf.png"
alt="Kitesurf"
fill
sizes="(max-width: 768px) 100vw, 50vw"