Icon Teaser Liste

Die Komponente "Iconteaser Liste" gibts es in zwei Varianten. Die vorausgewählte Variante ist maximal dreispaltig und sollte nicht in einen Container gepflegt werden. Abstände und Layout der Komponente werden automatisch gesetzt. Die Anzahl an Iconteasern pro Liste ist frei wählbar.

Die zweite Variante ist für die Nutzung in einem "Spaltenlayout" gedacht und wird nie mehr als eine Spalte haben.

Variante "Dreispaltig"

Teaser Überschrift

Die Iconteaser-Liste enthält bis zu drei Elemente pro Zeile. Man kann aus einem großen Pool an Icons wählen und dann die Farbigkeit von Icon und Linkfarbe setzen.

Iconteaser Link

Teaser Überschrift

Die Iconteaser-Liste enthält bis zu drei Elemente pro Zeile. Man kann aus einem großen Pool an Icons wählen und dann die Farbigkeit von Icon und Linkfarbe setzen.

Linktext steht hier

Icon orange, Link orange

Die Iconteaser-Liste enthält bis zu drei Elemente pro Zeile. Man kann aus einem großen Pool an Icons wählen und dann die Farbigkeit von Icon und Linkfarbe setzen.

Linktext steht hier

Rotes Icon, roter Link

Die Iconteaser-Liste enthält bis zu drei Elemente pro Zeile. Man kann aus einem großen Pool an Icons wählen und dann die Farbigkeit von Icon und Linkfarbe setzen.

Hier steht Linktext

Icon und Linkhintergrund in Textfarbe

Die Iconteaser-Liste enthält bis zu drei Elemente pro Zeile. Man kann aus einem großen Pool an Icons wählen und dann die Farbigkeit von Icon und Linkfarbe setzen.

Linktext

Teaser Überschrift

Man muss keinen Link pflegen. Eine Überschrift und ein Kurztext sollten allerdings vorhanden sein.
Der Kurztext kann Umbrüche enthalten.

Variante "Einspaltig"

Um diesen Abschnitt ist ein "Spaltenlayout" gepflegt, bei dem das Verhältnis der Spalten zueinander 2 zu 1 entspricht. Der Text hier hat dadurch etwas mehr Platz.

Die Variante "einspaltig" der Iconteaser-Liste ist in der zweiten Spalte gepflegt und über das Kontextmenü ausgewählt. Die Teaser werden immer übereinander stehen.

Iconteaser Überschrift

Wie bei der dreispaltigen Variante kann man ein Icon auswählen und die Farbigkeit. Man kann eine Überschrift und einen Text pflegen. Abschließend könnte man auch noch einen Link pflegen, um auf weitere Inhalte zu verweisen.

Relevanter Inhalt

Iconteaser Überschrift

Abstände sind normalisiert und die Liste selbst generiert keinen Abstand nach oben, so dass die Oberkante des ersten Teasers am Inhalt in der linken Spalte ausgerichtet ist.

Iconteaser Überschrift

Druckericon in blau