Principi Base Accessibilité Sistema di design Guidelines Deutsch Français Italiano English I nostri principi di design Soluzioni focalizzate sull’utente Riconoscibilità Inclusione Riduzione Olistico Autoesplicativo Orientamento all’attività Adeguatezza Portale della marca FFS Logo Orologio digitale Diritti di utilizzazione Colori die base Colori addizionali Colori Off Brand Icone Icone dell'orario Pittogrammi Informazioni sull’accessibilità Über diesen Guide Contatti Letture consigliate Product Owner User Research Interaction Design Visual Design Development Content Design Testing What is a design system? Designing Coding FAQ Aiuto Processo Contribution Contatto Introduzione Base Componenti Introduzione Releases Design Tokens Componenti Introduzione Base Informations Introduzione Base Componenti Introduzione Power-Apps Banner pubblicitari digitali SAP IA Design : Base. Icone delle app Questa pagina non è disponibile nella lingua desiderata. Lingue disponibili: Deutsch English Sidebar-Content Info

Was macht die Komponente?

Sie ist Teil der Sidebar-Komponente.

Wann soll die Komponente eingesetzt werden?

  • Nur innerhalb der Sidebar-Komponente.
Sidebar
Demo Default
Auf Storybook ausprobieren HTML einblenden
HTML in Zwischenablage kopiert. Implementation

The sbb-sidebar-content is a container which should be used inside a sbb-sidebar-container to wrap the content.

<sbb-sidebar-container>
  <sbb-sidebar role="navigation">Sidebar Content</sbb-sidebar>
  <sbb-sidebar-content role="main"></sbb-sidebar-content>
</sbb-sidebar-container>

Accessibility

The <sbb-sidebar-content> should be given a role based on what it contains. If it
represents the primary content of the page, it may make sense to mark it role="main". If no more
specific role makes sense, role="region" is a good fallback.

Use with sbb-header

Check sbb-sidebar-container on how to
position and connect the sbb-header with the sbb-sidebar-content.

Slots

Name Description
Use the unnamed slot to add any content elements. Further sbb-sidebar-containers are possible.
Contatto

Avete domande? Forse le nostre FAQ o la nostra guida vi saranno d'aiuto, altrimenti potete inserire la vostra domanda nella board corrispondente su Github.

Impressum Contatto Protezione dei dati Impostazioni dei cookie