Sayt pastki qismi

1. root.fx-site-footerşart
2. top.fx-site-footer__topixtiyoriy
3. about.fx-site-footer__aboutixtiyoriy
4. brand.fx-site-footer__brandixtiyoriy
5. text.fx-site-footer__textixtiyoriy
6. social.fx-site-footer__socialixtiyoriy
7. cols.fx-site-footer__colsixtiyoriy
8. title.fx-site-footer__titleixtiyoriy
9. links.fx-site-footer__linksixtiyoriy
10. bottom.fx-site-footer__bottomşart
11. legal.fx-site-footer__legalixtiyoriy
12. slots (til, mavzu).fx-site-footer__slotsixtiyoriy
13. group.fx-site-footer__groupixtiyoriy

<footer> (contentinfo); ustunlar <nav aria-label>; ustun sarlavhalari <h2>; til tanlagiçda aria-label.

Naqş: WAI-ARIA APG landmarks · rol contentinfo

npx foxui add site-footer

<footer class="fx-site-footer" data-fx-footer>
  <div class="fx-site-footer__top">
    <div class="fx-site-footer__about">
      <a class="fx-site-footer__brand" href="#"><svg viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="5" fill="currentColor"/></svg>Çorsu</a>
      <p class="fx-site-footer__text">Dökon va mijozlar bilan işlaşni soddalaştiruvçi platforma.</p>
      <div class="fx-site-footer__social"><a class="fx-btn" data-variant="ghost" href="#">Telegram</a><a class="fx-btn" data-variant="ghost" href="#">Instagram</a></div>
    </div>
    <nav class="fx-site-footer__cols" aria-label="Pastki menyu">
      <details class="fx-site-footer__group" open><summary class="fx-site-footer__title">Mahsulot</summary><ul class="fx-site-footer__links"><li><a href="#">Onlayn dökon</a></li><li><a href="#">CRM</a></li><li><a href="#">Narxlar</a></li></ul></details>
      <details class="fx-site-footer__group" open><summary class="fx-site-footer__title">Kompaniya</summary><ul class="fx-site-footer__links"><li><a href="#">Biz haqimizda</a></li><li><a href="#">Aloqa</a></li></ul></details>
      <details class="fx-site-footer__group" open><summary class="fx-site-footer__title">Yordam</summary><ul class="fx-site-footer__links"><li><a href="#">Hujjatlar</a></li><li><a href="#">Savol-javob</a></li></ul></details>
    </nav>
  </div>
  <div class="fx-site-footer__bottom">
    <p class="fx-site-footer__legal"><span>© 2026 Çorsu</span><a href="#">Maxfiylik</a><a href="#">Şartlar</a></p>
    <div class="fx-site-footer__slots">
    <div class="fx-segment fx-theme-switcher" data-variant="icon" role="group" aria-label="Mavzu" data-fx-themeswitch>
      <button class="fx-segment__item" type="button" data-value="system" aria-pressed="true"><svg class="fx-theme-switcher__icon" viewBox="0 0 20 20" aria-hidden="true"><rect x="2.5" y="4" width="15" height="10" rx="2" fill="none" stroke="currentColor" stroke-width="1.6"/><path d="M7 17h6" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/></svg><span class="fx-theme-switcher__label">Tizim</span></button>
      <button class="fx-segment__item" type="button" data-value="light" aria-pressed="false"><svg class="fx-theme-switcher__icon" viewBox="0 0 20 20" aria-hidden="true"><circle cx="10" cy="10" r="3.2" fill="none" stroke="currentColor" stroke-width="1.6"/><path d="M10 2.5v2M10 15.5v2M2.5 10h2M15.5 10h2M4.7 4.7l1.4 1.4M13.9 13.9l1.4 1.4M4.7 15.3l1.4-1.4M13.9 6.1l1.4-1.4" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/></svg><span class="fx-theme-switcher__label">Yoruğ</span></button>
      <button class="fx-segment__item" type="button" data-value="dark" aria-pressed="false"><svg class="fx-theme-switcher__icon" viewBox="0 0 20 20" aria-hidden="true"><path d="M16.5 11.5A6.5 6.5 0 0 1 8.5 3.5a6.5 6.5 0 1 0 8 8z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"/></svg><span class="fx-theme-switcher__label">Qoronği</span></button>
    </div>
    <div class="fx-langswitch" data-fx-langswitch>
      <button class="fx-langswitch__trigger" type="button" popovertarget="sf-lang" aria-haspopup="menu" aria-label="Til: Özbekça"><svg class="fx-langswitch__icon" viewBox="0 0 20 20" aria-hidden="true"><circle cx="10" cy="10" r="7.25" fill="none" stroke="currentColor" stroke-width="1.5"/><path d="M2.75 10h14.5M10 2.75c2 2 3 4.5 3 7.25s-1 5.25-3 7.25c-2-2-3-4.5-3-7.25s1-5.25 3-7.25z" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round"/></svg><span class="fx-langswitch__name">Özbekça</span><span class="fx-langswitch__code" aria-hidden="true">UZ</span><svg class="fx-langswitch__caret" viewBox="0 0 20 20" aria-hidden="true"><path d="M5.5 8l4.5 4.5L14.5 8" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/></svg></button>
      <div class="fx-menu fx-langswitch__menu" id="sf-lang" role="menu" aria-label="Tilni tanlang" popover data-fx-menu>
        <button class="fx-menu__item" type="button" data-value="uz" role="menuitemradio" aria-checked="true" lang="uz"><span class="fx-langswitch__endonym">Özbekça</span><span class="fx-langswitch__hint">UZ</span></button>
        <button class="fx-menu__item" type="button" data-value="ru" role="menuitemradio" aria-checked="false" lang="ru"><span class="fx-langswitch__endonym">Русский</span><span class="fx-langswitch__hint">RU</span></button>
        <button class="fx-menu__item" type="button" data-value="en" role="menuitemradio" aria-checked="false" lang="en"><span class="fx-langswitch__endonym">English</span><span class="fx-langswitch__hint">EN</span></button>
      </div>
    </div>
    </div>
  </div>
</footer>

Tokenlar: --fx-bg-page --fx-border-color-default --fx-border-color-focus --fx-border-width-default --fx-border-width-focus --fx-ease-standard --fx-font-size-sm --fx-font-weight-semibold --fx-motion-fast --fx-popover-width --fx-radius-badge --fx-size-icon-lg --fx-size-icon-md --fx-size-min-target --fx-space-1 --fx-space-10 --fx-space-2 --fx-space-3 --fx-space-4 --fx-space-6 --fx-space-8 --fx-text-primary --fx-text-secondary