Container
Die Containerkomponente kann genutzt werden um Elemente nebeneinander darzustellen. Hierzu stehen die folgenden Varianten zur Verfügung.
| Variantenname | Beschreibung |
|---|---|
container | Sorgt für die Anordnung der Kindelemente, sodass diese nebeneinander stehen. Die verfügbare Breite wird hierbei in 12 gleichmäßige Spalten unterteilt. |
column | Muss Kindelementen des Containers mit der vorherigen Variante gegeben werden. Zusätzlich kann die Breite der Spalte mit column-1 bis column-12 gestgelegt werden. |
Bilder
Diese Komponente kann zur Einbindung von Bildern genutzt werden. Über die nachfolgenden Varianten kann die Skalierung angepasst werden.
| Variantenname | Beschreibung |
|---|---|
ratio | Setzt die maximale Höhe des Bildes anhand des 16:9-Verhältnisses |
portrait | Streckt das Bild auf die maximal verfügbare Breite. Die Höhe ergibt sich entsprechend des Seitenverhältnisses. |
landscape | Streckt das Bild auf die maximal verfügbare Höhe. Die Breite ergibt sich entsprechend des Seitenverhältnisses. |
Layout
Repräsentiert eine Einbettungsebene für ein konfiguriertes Layout. Es kann nur auf der obersten Ebene genutzt werden und kann nur Seitenkomponenten enthalten.
Page
Repräsentiert eine Seite. Intial werden alle zu platzierenden Elemente auf einer Seite entsprechend ihres Layouts platziert. Das Javascript übernimmt dann die Verteilung auf Einzelseiten.
Paragraph
Wird für formatierten Text (strong, em, ul, li, a, etc.) genutzt und kann mit den nachfolgenden Varianten verändert werden.
| Variantenname | Beschreibung |
|---|---|
lead | Setzt die Schriftgröße auf $print-typography-size-lead. |
muted | Setzt die Schriftgröße auf $print-typography-size-muted. |
headline-1 bis headline-6 | Setzt die Schrifgröße auf die Überschriftgrößen entsprechend des Levels |
align-center | Zentriert den Inhalt der Komponente |
align-right | Richtet den Inhalt rechtsbündig aus |
columns | Unterteilt den Inhalt in horizontale Spalten. Mit den zusätzlichen Varianten columns-2 bis columns-4 kann die Anzahl an Spalten festgelegt werden. |