Navigieren auf digital.sbb.ch

Zur Startseite von digital.sbb.ch

Sidebar

1. Was macht das Modul?

  • Bietet die Möglichkeit eines direkten Zugriffs auf Inhalte und Funktionen von Anwendungen bzw. Anwendungsteilen.

2. Wann soll das Modul eingesetzt werden?

  • Zur Strukturierung und direkten Navigation auf Inhalte und Funktionen.

3. Regeln

3.1 Verhalten

  • Bei grossen Screens (Desktop und grösser) wird beim Ausklappen der Sidebar der Contentbereich in der Breite verkleinert. Bei kleineren Screens (Tablet, Mobile) wird der Content überdeckt durch die ausgeklappte Sidebar.

3.2 Layout

  • Die Höhe der Navigationsleiste entspricht der Höhe des kompletten Contentbereichs.

4. Ausprägungen und Zustände

4.1 Plain

Diese Ausprägung hat folgende Zustände:

  • Default
Darstellung der Sidebar in der Plain-Ausprägung
  • Die Menüeinträge können in Kategorien / Bereiche gegliedert werden.
  • Bei den Kategorien kann beim Einsatz der Sidebar zwischen Accordion und Fieldset gewählt werden.

Design Spezifikation

4.2 Iconleiste

Diese Ausprägung hat folgende Zustände:

  • Collapsed
  • Collapsed Hover
  • Expanded
  • Expanded Hover
Darstellung der Sidebar in der Icon-Ausprägung
  • Der Defaultzustand (collapsed, expanded) kann pro Anwendung festgelegt werden.
  • Bei Bedarf können die Navigationspunkte mittels Trennlinien visuell gruppiert werden.
  • Per Default soll der erste (der oberste) Navigationspunkt aktiv sein.

Design Spezifikation

4.3 Submenu

Diese Ausprägung hat folgende Zustände:

  • Collapsed
  • Expanded
Darstellung der Sidebar in der Submenu-Ausprägung
  • Der Defaultzustand (collapsed, expanded) kann pro Anwendung festgelegt werden.
  • Die Menüeinträge können in Kategorien / Bereiche gegliedert werden.
  • Bei den Kategorien kann beim Einsatz der Sidebar zwischen Accordion und Fieldset gewählt werden.

Design Spezifikation