Boxen

Hauptkapitel
Designsystem
Unterkapitel
Komponenten
Gilt für
Websites & Webapplikationen (mit Login)

Darstellung

Varianten

Infobox

  • Die Infobox hat die Akzentfarbe der Seite.
  • Der Inhalt wird entsprechend gefärbt.
  • Die Infobox ist so breit wie der Inhaltsbereich.

Titelbox

Besteht aus:

  • Titel (H3)
  • Linie

Formulartitelbox

Besteht aus:

  • Titel (H3)
  • Status (optional)
  • Editierfunktion (optional)

Themenbox

Besteht aus:

  • Titel (H3)
  • Icon (optional)
  • Status/Info am Icon (optional)
  • Text
  • Link (optional)

Linkbox

Besteht aus:

  • Link
  • Icon

Formularbox

Besteht aus 1-n Formularelementen.

Aktionsbox

Besteht aus:

  • Primärer Button
  • Sekundärer Button
  • Text-Link (optional)

Verwendung

Wir nutzen Boxen, um Inhalte und Formulare in Applikationen oder auf der Webseite darzustellen und zu strukturieren.

Infobox

  • Wir platzieren wichtige Informationen in der Infobox. Durch die Farbe heben sie sich vom restlichen Inhalt optisch hervor.
  • Folgende Inhaltselemente können in einer Infobox platziert werden:

Titelbox, Formulartitelbox, Themenbox, Linkbox, Formularbox und Aktionsbox

Diese Varianten der Boxen können wir gruppiert und untereinander darstellen.

Sie eignen sich vor allem für die Gestaltung von Applikationen. So kann beispielsweise ein Gruppe aus einer Themenbox und beliebig vielen Linkboxen bestehen.

Wichtig

Wir verwenden nur entweder eine Titelbox, eine Formulartitelbox oder eine Themenbox in einer Gruppe. Diese drei Varianten dürfen sich nie gemeinsam in einer Gruppe befinden.

Kontakt

Digitale Verwaltung - ZHweb

Ist Ihnen etwas aufgefallen? Fehlt etwas? Möchten Sie etwas beitragen? Melden Sie sich bei uns!

E-Mail

zhweb@sk.zh.ch