Eylem · Floating action button
Yüzen düğme
Ekranın köşesinde her zaman görünen tek eylem. Telefonda "Randevu al" gibi.
- CSS
- kararlı
- JavaScript
- gerekmiyor
- React
- kararlı
- Vue
- kararlı
Örnekler
HTML kodunu göster
<a class="trds-yuzen" href="#"><svg class="trds-simge" aria-hidden="true"><use href="#edk-date"/></svg><span>Randevu al</span></a>Ne zaman kullanılır
- Sayfanın tek ana eylemi varsa ve sayfa uzunsa kullanın.
- Masaüstünde kullanmayın. Orada eylem sayfanın başında durur.
Erişilebilirlik
- Metin taşır. Yalnız simge yeterli değildir.
- İçeriği örtmez. Sayfanın altında düğme kadar boşluk bırakılır.
Karşılanan WCAG 2.2 ölçütleri 2.5.81.4.10
Kaynak
Benzer bir bileşen şu ülkelerin tasarım sistemlerinde de var: KR, BR.