Sari la conținut

Proiect open-source independent. Domeniul oficial este sistem.digital.

Sistem DigitalCatalog versionatsistem.digital
Meniu

Catalog · Navigație

Footer

Grupează resurse, guvernanță, licență și versiune.

AlphaComponentăNavigație

Prezentare

Grupează resurse, guvernanță, licență și informații de versiune la finalul fiecărei pagini.

Când se folosește

  • o singură dată per pagină, ca ultimul element înaintea sfârșitului documentului.

Când nu se folosește

  • de mai multe ori pe aceeași pagină — un singur footer, la final, nu unul repetat între secțiuni.

Anatomie

Un `<footer class="sd-footer">` cu `__main` (grid, 3 coloane pe desktop, o coloană sub 48rem) conținând secțiuni cu `__heading`+`__list`, plus un rând `__meta` pentru informații suplimentare.

Variante

  • implicit — o singură variantă

Stări

  • nu are stări interactive proprii, dincolo de linkurile din interior

Comportament

Fără JavaScript: grid CSS complet funcțional, colapsat la o coloană sub 48rem prin media query. Nu apare deloc la tipărire (`display: none` în `@media print`) — resursele din footer nu au sens pe hârtie.

Reguli de conținut

  • linkurile sunt resurse reale (accesibilitate, licență, contact), nu umplutură generică.

Cercetare

Istoric

Istoricul modificărilor relevante
VersiuneDatăModificare
0.1.0-alpha.0Publicare inițială în @sistem-digital/components, ca parte a shell-ului de navigație instituțională și a căutării server-rendered (PR #50).

Structura completă a acestei secțiuni urmează șablonul canonic al paginii unei componente. Accesibilitatea (semantică, tastatură, focus) rămâne documentată separat, conform șablonului de accesibilitate.

Preview și markup canonic

Previzualizarea de mai jos redă exact șirul HTML afișat în exemplul de cod. Nu există o implementare paralelă pentru documentație.

Previzualizare din markup-ul canonic

Instalare și importuri

pnpm add @sistem-digital/tokens @sistem-digital/components
Import CSS
@import '@sistem-digital/components/navigation.css';
Markup canonic
<footer class="sd-footer"><div class="sd-footer__main"><section><h2 class="sd-footer__heading">Instituția exemplu</h2><p>Servicii digitale publice.</p></section><nav aria-label="Resurse"><ul class="sd-footer__list"><li><a href="#">Accesibilitate</a></li><li><a href="#">Contact</a></li></ul></nav></div></footer>

Contract și surse

Schimbarea claselor publice, a markup-ului canonic sau a comportamentului helperelor necesită versionare și instrucțiuni de migrare.

Matricea design–cod

Disponibilitatea reală a acestei componente, calculată din pachetele publicate, conform schemei matricei design–cod. Rândurile Figma, testare cu tastatura și testare cu cititor de ecran rămân „Indisponibil” până la dovezi publicate separat (kit Figma, respectiv auditul manual de accesibilitate).

Matricea design–cod pentru Footer
CanalDisponibilitate
FigmaIndisponibil
HTML/CSSDisponibil
Web ComponentsIndisponibil
ReactIndisponibil
DocumentațieDisponibil
Teste automateDisponibil
Testare cu tastaturaIndisponibil
Testare cu cititor de ecranIndisponibil

A fost utilă această pagină?

Linkul deschide un formular GitHub precompletat. Nu transmitem nimic până când alegi să publici feedback-ul și îți recomandăm să nu incluzi date personale.