feat: kovakyazilim.com WordPress sitesinden tasarım + içerik aktarımı
Hostinger SSH + WP-CLI ile mevcut canlı sitedeki tasarım ve içerikler aktarıldı. Tasarım değişiklikleri: - Renkler: navy #0F2C5C → #043e8c (deep navy), sky #4DA3C7 → #3b82f6 (bright blue) - Tailwind blue palette uyumlu, WP kovak temasıyla bire bir - Font: Geist → Poppins (300/400/500/600/700/800) - Hero: gradient açık → dark gradient (#0f172a → #1e293b → #334155) - Pulse animasyonlu radial glow - 'Web Tasarım', 'Yazılım', 'Ajansı' kelimelerini blue-400 vurgu - Stats strip artık hero'nun alt kenarında (4 metrik) İçerik aktarımı (Appwrite): site_settings/homepage güncellendi: - Hero: 'Kocaeli Web Tasarım ve Yazılım Ajansı' + 2015'ten beri tagline - Stats: 150+ proje / 50+ müşteri / 100% memnuniyet / 24/7 destek - Services intro: 'İzmit ve Kocaeli Web Tasarım Hizmetlerimiz' - Projects intro: 'İzmit Web Tasarım Referanslarımız' - CTA: 'Projeniz İçin Hemen Teklif Alın' 6 referans projesi seed edildi (WP'deki real client listesi): - Torpido Makina (torpidomakina.com.tr) — Volvo Penta yetkili bayi - Marjinal Dent (marjinaldent.com) — Diş kliniği - Abdullah Tosun Mimarlık (abdullahtosun.art) — Mimar portfoyu - Calibra PPF (calibrappf.com) — Araç kaplama - Atolye Bastar — Zanaat atölyesi (yakında) - MarineCRM — Denizcilik CRM (özel yazılım) 6 hizmet description'u WP içerikleriyle güncellendi: - web-tasarim → 'Profesyonel Web Tasarım İzmit' - e-ticaret → 'E-Ticaret Sitesi Yapımı' - mobil-uygulama → 'Mobil Uygulama Geliştirme' - yazilim-gelistirme → 'Özel Yazılım Geliştirme İzmit' - seo-dijital-pazarlama → 'SEO Hizmeti Kocaeli' - dijital-reklam → 'Dijital Pazarlama Kocaeli' 7 sektör/bölge landing sayfası industries tablosuna seed edildi: - /sektor/kocaeli-web-tasarim - /sektor/izmit-web-tasarim - /sektor/gebze-web-tasarim - /sektor/kocaeli-seo - /sektor/izmit-seo - /sektor/kocaeli-yazilim - /sektor/izmit-web-tasarim-fiyat (paket fiyat tablosu ile) Her sektör için: - WP'deki rank_math_description meta'ları SEO desc olarak - Markdown content + features list + FAQ - featured + order ayarlı 37 route, build temiz. Sıradaki adım: WP uploads klasöründen müşteri görsellerini indirip project image_url'lerini local'e taşıyabilir (şu an Pexels CDN kullanılıyor).
This commit is contained in:
+79
-66
@@ -1,11 +1,11 @@
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import { ArrowRight, Sparkles } from "lucide-react";
|
||||
import type { SiteSettingsRow, StatItem } from "@/lib/types";
|
||||
|
||||
const DEFAULT_STATS: StatItem[] = [
|
||||
{ value: "50+", label: "Tamamlanan proje" },
|
||||
{ value: "10+", label: "Yıllık deneyim" },
|
||||
{ value: "150+", label: "Tamamlanan proje" },
|
||||
{ value: "50+", label: "Aktif müşteri" },
|
||||
{ value: "100%", label: "Memnuniyet" },
|
||||
{ value: "24/7", label: "Teknik destek" },
|
||||
];
|
||||
|
||||
@@ -24,84 +24,97 @@ function parseStats(items?: string[] | null): StatItem[] {
|
||||
}
|
||||
|
||||
export function Hero({ settings }: { settings?: SiteSettingsRow | null }) {
|
||||
const badge = settings?.hero_badge ?? "Kocaeli'nin teknoloji ajansı";
|
||||
const badge =
|
||||
settings?.hero_badge ?? "Kocaeli Web Tasarım & Yazılım Ajansı";
|
||||
const title =
|
||||
settings?.hero_title ?? "Fikirden ürüne tek bir partner ile yola çıkın";
|
||||
settings?.hero_title ??
|
||||
"Kocaeli Web Tasarım ve Yazılım Ajansı";
|
||||
const subtitle =
|
||||
settings?.hero_subtitle ??
|
||||
"Web, mobil ve CRM çözümlerinde uçtan uca geliştirme. Markanıza özel tasarım, ölçeklenebilir altyapı ve uzun vadeli destek.";
|
||||
const primaryLabel =
|
||||
settings?.hero_cta_primary_label ?? "Proje görüşmesi başlat";
|
||||
"Kocaeli ve İzmit'te profesyonel web tasarım, SEO optimizasyonu ve özel yazılım çözümleri. 2015'ten bu yana işletmelere dijital dönüşümde rehberlik ediyoruz.";
|
||||
const primaryLabel = settings?.hero_cta_primary_label ?? "Ücretsiz Teklif Al";
|
||||
const primaryHref = settings?.hero_cta_primary_href ?? "/iletisim";
|
||||
const secondaryLabel =
|
||||
settings?.hero_cta_secondary_label ?? "Hizmetlerimizi inceleyin";
|
||||
settings?.hero_cta_secondary_label ?? "Hizmetlerimizi İnceleyin";
|
||||
const secondaryHref = settings?.hero_cta_secondary_href ?? "/hizmetler";
|
||||
const stats = parseStats(settings?.hero_stats);
|
||||
|
||||
return (
|
||||
<section className="relative overflow-hidden">
|
||||
<div className="absolute inset-0 hero-grid opacity-60" aria-hidden />
|
||||
<div className="absolute -right-32 top-1/2 -z-0 size-[520px] -translate-y-1/2 rounded-full bg-gradient-to-br from-[var(--sky)]/30 to-[var(--navy)]/0 blur-3xl" aria-hidden />
|
||||
<section className="hero-dark hero-glow relative overflow-hidden">
|
||||
{/* Grid pattern overlay */}
|
||||
<div
|
||||
className="absolute inset-0 opacity-[0.04]"
|
||||
style={{
|
||||
backgroundImage:
|
||||
"radial-gradient(circle at 1px 1px, white 1px, transparent 0)",
|
||||
backgroundSize: "32px 32px",
|
||||
}}
|
||||
aria-hidden
|
||||
/>
|
||||
|
||||
<div className="relative mx-auto grid max-w-7xl items-center gap-12 px-6 py-24 md:grid-cols-2 md:py-32">
|
||||
<div>
|
||||
<span className="inline-flex items-center gap-2 rounded-full border border-[var(--sky)]/30 bg-[var(--sky-50)] px-3 py-1 text-xs font-medium text-[var(--sky-600)]">
|
||||
<Sparkles className="size-3.5" />
|
||||
{badge}
|
||||
</span>
|
||||
<div className="relative mx-auto max-w-5xl px-6 py-24 text-center md:py-32">
|
||||
<span className="inline-flex items-center gap-2 rounded-full border border-blue-400/30 bg-[#043e8c]/30 px-4 py-1.5 text-sm font-medium text-blue-300">
|
||||
<Sparkles className="size-4" />
|
||||
{badge}
|
||||
</span>
|
||||
|
||||
<h1 className="mt-6 text-4xl font-bold leading-tight tracking-tight text-[var(--navy)] sm:text-5xl md:text-6xl">
|
||||
{title}
|
||||
</h1>
|
||||
<h1 className="mt-6 text-4xl font-extrabold leading-[1.1] tracking-tight text-white sm:text-5xl md:text-6xl">
|
||||
{title.split(" ").map((word, i, arr) => {
|
||||
// Highlight key words in blue (Web Tasarım, Yazılım)
|
||||
const highlight =
|
||||
word.toLowerCase().includes("web") ||
|
||||
word.toLowerCase().includes("tasarım") ||
|
||||
word.toLowerCase().includes("yazılım") ||
|
||||
word.toLowerCase().includes("ajansı");
|
||||
return (
|
||||
<span key={i}>
|
||||
<span className={highlight ? "text-blue-400" : undefined}>
|
||||
{word}
|
||||
</span>
|
||||
{i < arr.length - 1 && " "}
|
||||
</span>
|
||||
);
|
||||
})}
|
||||
</h1>
|
||||
|
||||
<p className="mt-6 max-w-xl text-lg leading-relaxed text-[var(--muted)]">
|
||||
{subtitle}
|
||||
</p>
|
||||
<p className="mx-auto mt-6 max-w-2xl text-base leading-relaxed text-slate-300 sm:text-lg">
|
||||
{subtitle}
|
||||
</p>
|
||||
|
||||
<div className="mt-8 flex flex-col gap-3 sm:flex-row">
|
||||
<Link
|
||||
href={primaryHref}
|
||||
className="inline-flex items-center justify-center gap-2 rounded-full bg-[var(--navy)] px-6 py-3 text-sm font-medium text-white transition hover:bg-[var(--navy-700)]"
|
||||
>
|
||||
{primaryLabel}
|
||||
<ArrowRight className="size-4" />
|
||||
</Link>
|
||||
<Link
|
||||
href={secondaryHref}
|
||||
className="inline-flex items-center justify-center gap-2 rounded-full border border-[var(--border)] bg-white px-6 py-3 text-sm font-medium text-[var(--navy)] transition hover:border-[var(--navy)]"
|
||||
>
|
||||
{secondaryLabel}
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
{stats.length > 0 && (
|
||||
<dl className="mt-12 grid max-w-md grid-cols-3 gap-6">
|
||||
{stats.map((stat) => (
|
||||
<div key={stat.label}>
|
||||
<dt className="text-2xl font-bold text-[var(--navy)]">
|
||||
{stat.value}
|
||||
</dt>
|
||||
<dd className="mt-1 text-xs text-[var(--muted)]">{stat.label}</dd>
|
||||
</div>
|
||||
))}
|
||||
</dl>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="relative flex justify-center">
|
||||
<div className="absolute inset-8 -z-10 rounded-full bg-gradient-to-br from-[var(--sky-50)] to-white blur-2xl" aria-hidden />
|
||||
<div className="animate-float">
|
||||
<Image
|
||||
src="/logo.png"
|
||||
alt="Kovak Yazılım"
|
||||
width={420}
|
||||
height={420}
|
||||
priority
|
||||
className="size-[320px] object-contain drop-shadow-[0_30px_50px_rgba(15,44,92,0.25)] md:size-[420px]"
|
||||
/>
|
||||
</div>
|
||||
<div className="mt-10 flex flex-col justify-center gap-3 sm:flex-row">
|
||||
<Link
|
||||
href={primaryHref}
|
||||
className="inline-flex items-center justify-center gap-2 rounded-xl bg-[var(--sky)] px-7 py-3.5 text-sm font-semibold text-white shadow-lg shadow-[var(--sky)]/30 transition hover:-translate-y-0.5 hover:bg-[var(--sky-600)] hover:shadow-xl hover:shadow-[var(--sky)]/40"
|
||||
>
|
||||
{primaryLabel}
|
||||
<ArrowRight className="size-4" />
|
||||
</Link>
|
||||
<Link
|
||||
href={secondaryHref}
|
||||
className="inline-flex items-center justify-center gap-2 rounded-xl border border-white/20 bg-white/5 px-7 py-3.5 text-sm font-semibold text-white backdrop-blur transition hover:border-white/40 hover:bg-white/10"
|
||||
>
|
||||
{secondaryLabel}
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Stats strip — pinned bottom of hero */}
|
||||
{stats.length > 0 && (
|
||||
<div className="relative border-t border-white/10 bg-black/20 backdrop-blur">
|
||||
<div className="mx-auto grid max-w-6xl grid-cols-2 gap-4 px-6 py-8 sm:grid-cols-4">
|
||||
{stats.map((stat) => (
|
||||
<div key={stat.label} className="text-center">
|
||||
<p className="text-3xl font-bold text-[var(--sky)] sm:text-4xl">
|
||||
{stat.value}
|
||||
</p>
|
||||
<p className="mt-1 text-xs text-slate-400 sm:text-sm">
|
||||
{stat.label}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user