fix(tasarim): kayıtlı-sıra satırında yazısız 56 px yuvarlak ok düğmesi; bandın tamamı tıklanabilir
All checks were successful
Deploy / deploy (push) Successful in 4m50s
All checks were successful
Deploy / deploy (push) Successful in 4m50s
Bilal (24 Eyl 2026): "buton cılız kaldı, yazılı bir buton olmasın". Turuncu yuvarlak ok (aria-label + title), hover'da ok kayar, gerilmiş link bandı kaplar. DESIGN.md §10.9 güncellendi (§4.1 metin+ok kuralının bilinçli istisnası). Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
@@ -836,6 +836,11 @@ kahramandır" uygulanır: mavi bantta (§10.8 kompakt kabuk + `PikselZemin`) **i
|
||||
sıra `font-heading text-3xl font-bold leading-none tracking-tight sm:text-4xl` (Cal Sans'ta
|
||||
tabular-nums yok, §3) ve
|
||||
altında `text-sm font-semibold text-white/80` "sıra · Sayısal"; başlık `font-heading text-xl
|
||||
font-bold leading-tight text-balance sm:text-2xl`; buton 48 px turuncu, ok sonda. Telefonda
|
||||
başlık → sayı → buton alt alta ortalı; lg'de tek satır (sayı · başlık · buton). Yükseklik her
|
||||
iki hâlde formu aşmaz (CLS).
|
||||
font-bold leading-tight text-balance sm:text-2xl`. **Buton yazısız** (Bilal, 24 Eyl 2026: "buton
|
||||
cılız kaldı, yazılı bir buton olmasın" — §4.1'in "metin + sondaki ok" kuralının bilinçli
|
||||
istisnası): `flex size-14 items-center justify-center rounded-full bg-orange-500 text-white
|
||||
shadow-lg shadow-orange-500/30` + `ArrowRight size-7`, hover `bg-orange-600` ve ok 2 px kayar,
|
||||
basınca `scale-[0.95]`; `aria-label` + `title` "Sıralamana uygun programları gör". Bandın
|
||||
tamamı gerilmiş linkle (`after:absolute after:inset-0`, §4.8) tıklanabilir. Telefonda başlık →
|
||||
sayı → ok alt alta ortalı; lg'de tek satır (sayı · başlık · ok). Yükseklik her iki hâlde formu
|
||||
aşmaz (CLS).
|
||||
|
||||
@@ -409,9 +409,11 @@ export function CtaSiraForm({
|
||||
</div>
|
||||
{profil ? (
|
||||
// Şişko ve sade (DESIGN.md §1.1, §10.9): sayı kahramandır — iri
|
||||
// kupa kutusu + text-3xl/4xl sıra, başlık text-xl/2xl, 48 px buton.
|
||||
// Telefonda başlık → sayı → buton alt alta; lg'de tek satır
|
||||
// (sayı · başlık · buton). Yükseklik formunkini aşmaz (CLS notu).
|
||||
// kupa kutusu + text-3xl/4xl sıra, başlık text-xl/2xl. Buton yazısız:
|
||||
// 56 px yuvarlak turuncu ok (Bilal, 24 Eyl 2026: "buton cılız kaldı,
|
||||
// yazılı bir buton olmasın"); bandın tamamı gerilmiş linkle
|
||||
// tıklanabilir (§4.8 deseni). Telefonda başlık → sayı → ok alt
|
||||
// alta; lg'de tek satır. Yükseklik formunkini aşmaz (CLS notu).
|
||||
<div className="col-start-1 row-start-1 flex flex-col items-center justify-center gap-4 text-center lg:flex-row lg:gap-6 lg:text-left">
|
||||
<p
|
||||
id={baslikId}
|
||||
@@ -433,19 +435,17 @@ export function CtaSiraForm({
|
||||
</span>
|
||||
</span>
|
||||
</p>
|
||||
<Button
|
||||
asChild
|
||||
size="lg"
|
||||
className={cn(
|
||||
PROFILLI_CTA_SINIF,
|
||||
"order-3 w-full active:scale-[0.97] sm:w-auto lg:shrink-0",
|
||||
)}
|
||||
<Link
|
||||
href={sonucHref()}
|
||||
aria-label="Sıralamana uygun programları gör"
|
||||
title="Sıralamana uygun programları gör"
|
||||
className="group order-3 flex size-14 shrink-0 items-center justify-center rounded-full bg-orange-500 text-white shadow-lg shadow-orange-500/30 transition-[background-color,transform,box-shadow] duration-200 after:absolute after:inset-0 hover:bg-orange-600 hover:shadow-orange-500/40 active:scale-[0.95] lg:order-3"
|
||||
>
|
||||
<Link href={sonucHref()}>
|
||||
Sıralamana uygun programları gör
|
||||
<ArrowRight className="size-4" aria-hidden />
|
||||
<ArrowRight
|
||||
className="size-7 transition-transform duration-200 group-hover:translate-x-0.5"
|
||||
aria-hidden
|
||||
/>
|
||||
</Link>
|
||||
</Button>
|
||||
</div>
|
||||
) : null}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user