Ma'lumot · pattern
Javoblarni tekşiring
Yuborişdan oldingi xulosa sahifasi (naqş, GOV.UK «Check answers»): bölimlar böyiça «savol — javob — Özgartiriş» qatorlari; töldirilmagan majburiy javob «! Kiritilmagan» va «Kiritiş» havolasi bilan ajraladi; oxirida tasdiq va «Yuboriş». Uzun formalar, arizalar, buyurtmalar uçun.
Variantlar
| Atribut | Qiymatlar | Standart |
|---|---|---|
data-state | missing Majburiy javob kiritilmagan | — |
Anatomiya
- root
.fx-reviewşart - title
.fx-review__titleixtiyoriy - section
.fx-review__sectionşart - head
.fx-review__headixtiyoriy - heading
.fx-review__headingixtiyoriy - list
.fx-review__listşart - row
.fx-review__rowşart - key
.fx-review__keyixtiyoriy - value
.fx-review__valueixtiyoriy - action
.fx-review__actionixtiyoriy - confirm
.fx-review__confirmixtiyoriy - confirm-title
.fx-review__confirm-titleixtiyoriy - note
.fx-review__noteixtiyoriy - actions
.fx-review__actionsixtiyoriy
Holatlar
missing
Klaviatura va kiriş
| Tugma | Amal |
|---|---|
| Tab | «Özgartiriş» havolalari, tasdiq checkbox'i va tugmalar böylab |
Har bölim section + sarlavha (aria-labelledby); qatorlar dl / dt / dd. «Özgartiriş» havolalari içida sr-only kontekst («— telefon»). Töldirilmagan javob — «!» belgisi, «Kiritilmagan» sözi va çap qizil çiziq (rang yolğiz emas). Tasdiq checkbox'i required.
Kod
AI uçun: qaçon işlatiladi
Işlating
- Köp qadamli ariza, röyxatdan ötiş, buyurtma — yuborişdan oldingi oxirgi sahifa.
- Davlat xizmati, bank, ta'lim arizalari kabi xato qimmatga tuşadigan joylar.
Işlatmang
- Qadamlar va «Keyingi/Orqaga» bilan forma (xulosa içida avtomatik) →
wizard - Yozuvning oddiy ma'lumotlar röyxati →
dl - «Özgartiriş» havolasini kontekstsiz qoldirmang — sr-only matn qaysi javob ekanini aytsin (aks holda ekran öquvçi 10 ta bir xil havolani eşitadi).
- Töldirilmagan majburiy javobni böş qoldirmang — «! Kiritilmagan» va «Kiritiş» havolasi.
- Xulosani tahrirlanadigan forma qilib yubormang — bu sahifa faqat öqiş uçun, özgartiriş öşa qadamda.
npx foxui add review
<form class="fx-review" onsubmit="event.preventDefault()">
<h2 class="fx-review__title">Arizani yuborişdan oldin tekşiring</h2>
<section class="fx-review__section" aria-labelledby="rv-1">
<div class="fx-review__head"><h3 class="fx-review__heading" id="rv-1">Şaxsiy ma'lumotlar</h3></div>
<dl class="fx-review__list">
<div class="fx-review__row"><dt class="fx-review__key">Ism familiya</dt><dd class="fx-review__value">Jasur Abdullayev</dd><dd class="fx-review__action"><a href="#">Özgartiriş<span class="fx-sr-only"> — ism familiya</span></a></dd></div>
<div class="fx-review__row"><dt class="fx-review__key">Tuğilgan sana</dt><dd class="fx-review__value">14.03.1994</dd><dd class="fx-review__action"><a href="#">Özgartiriş<span class="fx-sr-only"> — tuğilgan sana</span></a></dd></div>
<div class="fx-review__row"><dt class="fx-review__key">Telefon</dt><dd class="fx-review__value">+998 90 123 45 67</dd><dd class="fx-review__action"><a href="#">Özgartiriş<span class="fx-sr-only"> — telefon</span></a></dd></div>
<div class="fx-review__row" data-state="missing"><dt class="fx-review__key">Pasport</dt><dd class="fx-review__value">Kiritilmagan</dd><dd class="fx-review__action"><a href="#">Kiritiş<span class="fx-sr-only"> — pasport seriyasi va raqami</span></a></dd></div>
</dl>
</section>
<section class="fx-review__section" aria-labelledby="rv-2">
<div class="fx-review__head"><h3 class="fx-review__heading" id="rv-2">Kurs va tölov</h3><a href="#">Bölimni özgartiriş<span class="fx-sr-only">: kurs va tölov</span></a></div>
<dl class="fx-review__list">
<div class="fx-review__row"><dt class="fx-review__key">Kurs</dt><dd class="fx-review__value">Frontend dasturlaş, 6 oy</dd><dd class="fx-review__action"><a href="#">Özgartiriş<span class="fx-sr-only"> — kurs</span></a></dd></div>
<div class="fx-review__row"><dt class="fx-review__key">Guruh</dt><dd class="fx-review__value">Keçki — duşanba, çorşanba, juma
19:00–21:00</dd><dd class="fx-review__action"><a href="#">Özgartiriş<span class="fx-sr-only"> — guruh</span></a></dd></div>
<div class="fx-review__row"><dt class="fx-review__key">Tölov</dt><dd class="fx-review__value">12 × 1 450 000 söm (bölib tölaş)</dd><dd class="fx-review__action"><a href="#">Özgartiriş<span class="fx-sr-only"> — tölov usuli</span></a></dd></div>
<div class="fx-review__row"><dt class="fx-review__key">Promo-kod</dt><dd class="fx-review__value">KUZ30 — −2 610 000 söm</dd><dd class="fx-review__action"><a href="#">Özgartiriş<span class="fx-sr-only"> — promo-kod</span></a></dd></div>
</dl>
</section>
<section class="fx-review__confirm" aria-labelledby="rv-3">
<h3 class="fx-review__confirm-title" id="rv-3">Tasdiqlaş</h3>
<p class="fx-review__note">Yuborgaç, menejer 1 iş kuni içida qönğiroq qiladi. Ma'lumotlarni keyin kabinetda özgartiriş mumkin.</p>
<label class="fx-check"><input type="checkbox" required><span class="fx-check__box"></span>Ma'lumotlar töğri va şartnoma şartlariga roziman</label>
<div class="fx-review__actions"><button class="fx-btn" type="submit" data-variant="primary">Arizani yuboriş</button><button class="fx-btn" type="button" data-variant="ghost">Qoralama sifatida saqlaş</button></div>
</section>
</form>Tokenlar: --fx-border-color-default --fx-border-color-error --fx-border-color-focus --fx-border-width-default --fx-border-width-focus --fx-dialog-width --fx-font-size-md --fx-font-size-sm --fx-font-size-xl --fx-font-weight-medium --fx-font-weight-semibold --fx-radius-badge --fx-space-1 --fx-space-2 --fx-space-3 --fx-space-4 --fx-space-8 --fx-text-brand --fx-text-error --fx-text-primary --fx-text-secondary
Şu toifadan
API kalitlariAPI kalitlari boşqaruvi (naqş): «Yangi kalit» dialogi (nom, muddat, ruxsat) → kalit BIR MARTA körsatiladi (nusxalaş tugmasi va ogohlantiriş bilan) → röyxatda faqat prefiks qoladi.Audit jurnaliXavfsizlik va boşqaruv jurnali (4.191): «kim · nima · qaçon · qayerdan».Ustunli röyxatHar satrda nom, uluş çiziği va qiymat: eng köp trafik manbalari, şaharlar, mahsulotlar.Tarif va hisob-kitobTarif va hisob-kitob sahifasi (naqş): joriy reja (narx sömda, keyingi tölov sanasi, avtomatik uzaytiriş), foydalaniş meter'lari (çegara yaqin — ogohlantiriş), tölov usuli (karta turi, •••• 4417, muddat) va hisob-fakturalar jadvali (PDF).Doska (kanban)Holat ustunlari va kartalar.GrafikGrafik oilasi: ustun (guruh, ustma-ust), gorizontal ustun, çiziq (yakka seriyada sönuvçi maydon), mini-çiziq, donut (≤ 4 bölak), uluş çiziği, çiziqli ölçagiç va issiqlik xaritasi.