fix(tasarim): şehir sayfasındaki üniversiteler §4.15 liste satırı — 48 px logo, iri ad, tür çipi
All checks were successful
Deploy / deploy (push) Successful in 4m49s

- UniSatirlari: kenarlıklı liste, satırın tamamı üniversite sayfasına link,
  SATIR_AD_DUZ ad (hover mavi, §2.1 istisnası), SATIR_META içinde tür çipi +
  program sayısı (+ ana il farklıysa il), sağda kayan ok, active:scale-[0.99].
  İki sütunlu kompakt UniLinkleri /universiteler dizininde kaldı.
- DESIGN.md §4.17 güncellendi.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
bilalgursen
2026-09-24 15:41:20 +03:00
parent 6690d3b779
commit a0e94bc024
2 changed files with 72 additions and 7 deletions

View File

@@ -2,6 +2,16 @@ import type { Metadata } from "next";
import Link from "next/link";
import { notFound } from "next/navigation";
import { Building2, ChevronRight, Landmark, MapPin } from "lucide-react";
import {
SATIR_AD_DUZ,
SATIR_CIP,
SATIR_GRUP,
SATIR_META,
} from "@/components/liste-satiri";
import { UniLogo } from "@/components/uni-logo";
import { trBaslikDuzeni } from "@/lib/slug";
import { UNITUR_ETIKET } from "@/lib/unitur";
import { cn } from "@/lib/utils";
import {
getAllIller,
getAllIlSlugs,
@@ -22,7 +32,6 @@ import { NavBaslik } from "./nav-baslik";
import { SehirCipleri, oneCikanIller } from "./sehir-cipleri";
import { SehirPikselHaritasi } from "./sehir-piksel-haritasi";
import { SehirYuzeyi } from "./sehir-yuzeyi";
import { UniLinkleri } from "./universite-listesi";
const sayi = (n: number) => n.toLocaleString("tr-TR");
@@ -46,12 +55,65 @@ export function ilSayfaMetadata(slug: string): Metadata {
});
}
/**
* Şehir sayfasının üniversite satırları — DESIGN.md §4.15 liste satırı
* (Bilal, 24 Eyl 2026: "il kısmında bulunan üniler küçük gözüküyor"): 48 px
* logo, `text-base font-semibold` ad, altında tür çipi + program sayısı,
* satırın tamamı üniversite sayfasına link (44 px'ten iri dokunma hedefi).
* Ad hover'ı §2.1 istisnasıyla mavi, satır zemini turuncuya döner, sağdaki
* ok kayar. Üniversitenin ana ili bu sayfadan farklıysa (ODTÜ KKTC sayfasında)
* il de metada yazar.
*/
function UniSatirlari({ uniler, buIl }: { uniler: UniOzet[]; buIl: string }) {
return (
<ol className="mt-4 divide-y divide-slate-100 overflow-hidden rounded-xl border border-slate-200 bg-white text-left">
{uniler.map((u) => {
const tur = u.unitur ? UNITUR_ETIKET[u.unitur]?.cip : null;
const digerIl = u.il && u.il !== buIl ? trBaslikDuzeni(u.il) : null;
return (
<li key={u.slug}>
<Link
href={`/universite/${u.slug}`}
className="group flex items-start gap-3 px-3 py-4 transition-[background-color,transform] duration-150 hover:bg-orange-50/60 active:scale-[0.99] sm:items-center sm:gap-4 sm:px-5 lg:py-3"
>
<UniLogo slug={u.slug} ad={u.ad} boy="sm" />
<span className="min-w-0 flex-1">
<span className={SATIR_GRUP}>
<span
className={cn(
SATIR_AD_DUZ,
"transition-colors group-hover:text-primary group-hover:underline",
)}
>
{u.ad}
</span>
<span className={SATIR_META}>
{tur ? <span className={SATIR_CIP}>{tur}</span> : null}
{digerIl ? <span className="shrink-0">{digerIl}</span> : null}
<span className="shrink-0">{sayi(u.programSayisi)} program</span>
</span>
</span>
</span>
<ChevronRight
className="mt-3 size-4 shrink-0 text-slate-400 transition-[color,transform] duration-150 group-hover:translate-x-0.5 group-hover:text-orange-500 sm:mt-0"
aria-hidden
/>
</Link>
</li>
);
})}
</ol>
);
}
function UniGrubu({
baslik,
uniler,
buIl,
}: {
baslik: string;
uniler: UniOzet[];
buIl: string;
}) {
if (uniler.length === 0) return null;
return (
@@ -62,7 +124,7 @@ function UniGrubu({
{sayi(uniler.length)}
</span>
</h2>
<UniLinkleri uniler={uniler} />
<UniSatirlari uniler={uniler} buIl={buIl} />
</section>
);
}
@@ -181,9 +243,9 @@ export function IlIcerik({ slug }: { slug: string }) {
<PagePixelDivider seed={71} className="mx-auto mt-8 lg:mx-0" />
<UniGrubu baslik="Devlet Üniversiteleri" uniler={devlet} />
<UniGrubu baslik="Vakıf Üniversiteleri" uniler={vakif} />
<UniGrubu baslik="KKTC ve Yurt Dışı" uniler={diger} />
<UniGrubu baslik="Devlet Üniversiteleri" uniler={devlet} buIl={il.il} />
<UniGrubu baslik="Vakıf Üniversiteleri" uniler={vakif} buIl={il.il} />
<UniGrubu baslik="KKTC ve Yurt Dışı" uniler={diger} buIl={il.il} />
<section className="mt-12 text-center lg:text-left" aria-labelledby="diger-sehirler">
<h2