Bileşenler
SaveBar
Formda kaydedilmemiş değişiklik varken alttan yükselen, Kaydet ve Vazgeç düğmeli çubuk.
- Storybook
- Storybook
- Kaynak kod
- Kaynak kod
Rol ve anlam
Bölüm başlığı “Rol ve anlam”Çubuk “Kaydedilmemiş değişiklikler” adlı bir section bölgesidir. Mesaj role="status" içindedir; çubuk açılınca okunur. Kapalıyken çubuk inert taşır, böylece görünmez düğmeler odak sırasında kalmaz.
Klavye
Bölüm başlığı “Klavye”| Tuş | Davranış |
|---|---|
| Tab | Sayfanın sonunda Vazgeç’e, sonra Kaydet’e. |
| Enter, Space | Düğmeyi çalıştırır. |
Çubuk açılınca odak taşınmaz; kullanıcı yazmaya devam eder. Kaydet’ten sonra çubuk kapanırsa odağı sayfada anlamlı bir yere, ör. sayfa başlığına taşıyın.
Ekran okuyucu
Bölüm başlığı “Ekran okuyucu”| Örnek | Okunan |
|---|---|
| Açılınca | “Kaydedilmemiş değişiklikleriniz var” |
| Kaydedilince | “Kaydedildi” |
Kontrast
Bölüm başlığı “Kontrast”Metin 4,5:1, üst kenarlık 3:1 kontrast taşır; gölge yalnızca derinlik içindir.
WCAG 2.2
Bölüm başlığı “WCAG 2.2”| Ölçüt | SaveBar nasıl karşılar | Ürün ekibi ne yapmalı |
|---|---|---|
| 2.4.11 Odak gizlenmez | — | Sabit çubuk odaktaki alanı örtmesin: sayfanın altına boşluk bırakın ya da sticky kullanın. |
| 3.3.4 Hata önleme | Ayrılmadan önce tarayıcı onayı. | — |
| 4.1.3 Durum mesajları | Açılma ve kaydetme duyurulur. | — |