Körsatiş · molecule
Callout
Hujjat içidagi eslatma: alert'dan yengilroq — yengil tus, çap çiziq, sarlavha sözi + şakl. Turlar: note, tip, important, warning, caution.
Variantlar
| Atribut | Qiymatlar | Standart |
|---|---|---|
data-tone | tipimportantwarningcaution | note |
Anatomiya
- root
.fx-calloutşart - title
.fx-callout__titleixtiyoriy - body
.fx-callout__bodyixtiyoriy
Klaviatura va kiriş
Statik, roli yöq. Holat sarlavha sözi bilan aytiladi, şakl dekorativ. Muhim xatar bölsa sarlavhada söz yozing («Ehtiyot böling»).
Kod
AI uçun: qaçon işlatiladi
Işlating
- Hujjat/maqola içida eslatma, maslahat, ogohlantiriş.
npx foxui add callout
<aside class="fx-callout" data-tone="tip"> <p class="fx-callout__title">Maslahat</p> <div class="fx-callout__body"><p>Mavzuni <code>data-fx-theme</code> bilan almaştiring — komponentlar özgarmaydi.</p></div> </aside> <aside class="fx-callout" data-tone="caution"> <p class="fx-callout__title">Ehtiyot böling</p> <div class="fx-callout__body"><p>Bu buyruq mijoz bazasini tozalaydi.</p></div> </aside>
Tokenlar: --fx-border-width-focus --fx-fg-error --fx-fg-success --fx-fg-warning --fx-font-size-sm --fx-font-weight-semibold --fx-radius-badge --fx-radius-circle --fx-radius-control --fx-size-status-dot-sm --fx-space-1 --fx-space-2 --fx-space-3 --fx-space-4 --fx-text-brand --fx-text-primary --fx-text-secondary
Şu toifadan
Nişon kartasiYutuq nişoni: belgi (emoji yoki ikon) + nom + sabab.BiriktirmaFayl yoki rasm kartoçkasi: belgi (tur) yoki rasm, nom, hajm, olib taşlaş ×, yuklaniş çiziği.Audio pleyerIxçam audio pleyer: ijro tugmasi, sarlavha, tölqinsimon progress (bosib yoki ← → bilan suriladi), vaqt va tezlik (1× · 1,5× · 2×).AvatarKvadrat avatar: ikki harf yoki surat, 6 toifa rangi, 3 ölçam (sm 22 · md 36 · lg 56), ixtiyoriy holat nuqtasi (active — puls, waiting, stopped, idle).Belgi (badge)Holat yoki toifa yorliği.Boğlovçi nurIntegratsiya va ma'lumot oqimi sxemasi (4.70): tugunlar (logo yoki ikon) orasida yumşoq egri çiziq, ustidan yuguruvçi nur yönalişni körsatadi.