Prototip · görsel eşitlik sözleşmesi (§10.9)

v1.1 → v1.2 bilinçli farklar

Sol kutu v1.1'in değerleriyle (tokens.css + yerel shadcn sınıfları), sağ kutu v1.2'nin değerleriyle (paket serileştiricisinin Randevu varsayılanı çıktısı + paket bileşen sınıfları) çizildi. A20 karşılaştırmasında bu listede olmayan her fark kusurdur. Kimlikler docs/qa/visual-diff.md'de aynen kullanılır.

V1 · Varsayılan yazı tipi: sistem yığını → Inter (S1)Her ekran. A20 bu yüzden iki tarafı da kayıtlı font = Inter iken çeker; bu fark yalnız varsayılan temalı kurulumda görülür. Müşteri ilk yüklemesi + ≈ 48–85 KB woff2 (latin + gerekirse latin-ext).

v1.1 · system-ui

İsmail Işık · Salı, 3 Kasım · 10:00–10:45 · ₺1.250,00

Öğle arası ve izin günleri müşteriye gösterilmez.

v1.2 · Inter Variable

İsmail Işık · Salı, 3 Kasım · 10:00–10:45 · ₺1.250,00

Öğle arası ve izin günleri müşteriye gösterilmez.

V2 · H1 22 → 21,16 px (geometrik ölçek); H2/H3 ve onay tarihi korunurPaket --text-xl 21,16 px'tir; 22 px'e en yakın adım budur (−0,84 px). H2 18 → 18,4 px. H2/H3 ağırlığı başlık ağırlığı − 50 = 650 (değişmez). Onay sayfası tarihi text-2xl yerine text-3xl (27,98 px) ile 28 px'te kalır; adla eşleseydi 24,33 px'e düşerdi.

v1.1

Hangi hizmeti almak istersiniz?

Müşteri bağlantınız

Salı, 3 Kasım 2026

v1.2

Hangi hizmeti almak istersiniz?

Müşteri bağlantınız

Salı, 3 Kasım 2026

Kaçınılan eşleme: Salı, 3 Kasım 2026 (text-2xl = 24,33 px)

V3 · Odak göstergesi: 3 px çizgi → 2 px halka + 2 px boşluk (tek görünüm)Yalnız klavye odağında görünür; A20 ekranlarında yok. Paket primitifleri halkayı çizer; Randevu'nun kendi öğeleri (ChoiceLink, SlotGrid, takvim blokları, bağlantılar) aynı geometriye çekilir (§10.8). Halka #1A56DB zemine 5,67:1, koyu #7DA2F5 7,26:1.

v1.1

Saç kesimi45 dk

v1.2

Saç kesimi45 dk

V4 · Kart gölgesi daha hafif (yüzey katmanı 1)Bugün listesi, özet ve onay kartları, ayarlar bölümleri. Tailwind shadow-sm → --surface-1-shadow (0 1px 2px / %6).

v1.1

Müşteri bağlantınız

https://randevu.isilguzellik.com

v1.2

Müşteri bağlantınız

https://randevu.isilguzellik.com

V5 · Diyalog ve Sheet yüzeyi: background → popover, köşe 10 → 14 pxAçıkta #F6F5F2 → #FFFFFF, koyuda #161514 → #1F1E1C. İptal onayı, silme onayları, D3, randevu detay Sheet'i (< 1024). A20'de görünmez (kapalı); E2E ve elle kontrolde görülür.

v1.1

Randevu iptal edilsin mi?

İsmail Işık · Sal 3 Kasım 10:00 · Saç kesimi.

v1.2

Randevu iptal edilsin mi?

İsmail Işık · Sal 3 Kasım 10:00 · Saç kesimi.

V6 · Pasif sekme metni: foreground → muted-foregroundTakvim Gün/Hafta sekmeleri. #5C5A55 muted zemin üzerinde 5,78:1 (AA geçer).

v1.1

GünHafta

v1.2

GünHafta

V7 · Koyu modda yıkıcı düğme: %60 kırmızı + beyaz → tam #F97066 + siyah7 çağrı yeri (iptal onayı, iptal paneli, hizmet/personel/izin/logo silme, hata özeti). Siyah yazı 7,54:1 (v1.1: beyaz, %60 karışımda 5,6–5,9:1). Düğme koyu zeminde belirgin biçimde daha parlak görünür. A20 koyu ekranlarında yok; koyu axe taramasına eklenir.

v1.1 · koyu

Randevuyu iptal et

v1.2 · koyu

Randevuyu iptal et

V8 · Form alanı yazısı her genişlikte 16 px (v1.1: ≥ 768 px'te 14 px)Randevu her Input/Textarea'ya text-base verir (§10.9.2-6). Paketin varsayılanı text-sm + yalnız dokunmatikte 16 px; kural konmasaydı aynı formda 16 px ve 13,91 px alanlar yan yana dururdu (sağ alttaki "kaçınılan"). A20'de 768/1024/1280 form ekranlarında görünür.

v1.1 · 1280 pxHizmet adıSüre (dk)

v1.2 · 1280 pxHizmet adıSüre (dk)

Kaçınılan:

V9 · Dokunmatikte 44 px taban (düğme, alan, seçici, sekme, ikon düğmesi)Yalnız pointer: coarse. Admin araç çubuğundaki 32–36 px sm düğmeler telefonda/tablette 44 px olur (WCAG 2.5.5 yönünde iyileşme). Fareli 360 px ekran görüntülerinde görünmez; dokunmatik nokta kontrolü §10.9.1.

v1.1 · dokunmatik

Önceki günBugün

v1.2 · dokunmatik

Önceki günBugün

V10 · Koyu modda color-scheme: darkSerileştirici :root'a light, .dark'a dark yazar. Kaydırma çubukları, yerel onay kutusu/dosya seçici (logo yükleme) koyu çizilir. A20 koyu ekranlarında (müşteri ana sayfa, Bugün) kaydırma çubuğu rengi.

v1.1 · koyu yerel kontrol açık şema

v1.2 · koyu yerel kontrol koyu şema

V11 · Küçük ölçek adımları (≤ 0,4 px) ve gölge/yüzey ayrıntılarıxs 12 → 12,1; sm 14 → 13,91; lg 18 → 18,4 px. Açılır pencere/menü gölgesi --surface-2-shadow. Tablo satırı fare üstü muted/50 → /60. Piksel karşılaştırmada eşik altı kalabilir; kalırsa bu kimlikle sınıflanır.

V12 · Taslak önizleme şeridi (yalnız taslak varken)v1.1'in temalı şeridi yerine paketin sabit koyu şeridi; metinler ve düğmeler paketin (§10.6). A20 taslaksız çekildiği için görünmez; A22 E2E sınar.