Mit der IconDescriptionList kannst du Term-Details-Paarungen pflegen, die zusätzlich mit einem Icon ergänzt und illustriert werden. Außerdem kannst du einen Einleitungstext mit Überschrift und Unterüberschrift ergänzen. Achte darauf, dass du das Element tatsächlich nur benutzt, wenn du semantisch eine DescriptionList pflegen möchtest. Solltest du gewöhnliche Icon-Text-Kombinationen mit einer Headline pflegen wollen, benutze das IconTextList Element.
Der Term ist jeweils nur ein Eingabefeld. Bei den Details hast du aber eingeschränkte RTE-Möglichkeiten zur Verfügung wie hochgestellten oder tiefgestellten Text und Links.
Für das Layout stehen dir mehrere Varianten zur Verfügung, die die Liste auf eine gewünschte Spaltenanzahl verteilen.
Wichtig: Wenn du Term-Details-Paarungen mit Icons pflegen möchtest, aber es ist kein passendes Icon im Icon-Set vorhanden, baue niemals die Optik mit anderen Elementen irgendwie nach, sondern wende dich an das Designteam von New Communication, damit das Icon-Set entsprechend erweitert werden kann! Wird kein Icon ausgewählt, erscheint das Fallback-Icon.
Hier steht die Unterüberschrift
Eine Paarung, Auto layout
Bei einer Paarung steht die IconDescriptionList im Auto layout in 6 Rastereinheiten.
- Erster Description Term
- Erstes Description Detail
Hier steht die Unterüberschrift
Zwei Paarungen, Auto layout
Bei zwei oder mehr Paarungen steht die IconDescriptionList im Auto layout in 10 Rasterbreiten.
- Erster Description Term
- Erstes Description Detail
- Zweiter Description Term
- Zweites Description Detail
Hier steht die Unterüberschrift
Drei Paarungen, Auto layout
Bei drei Paarungen verteilen sich die Elemente dreispaltig im Auto layout.
- Erster Description Term
- Erstes Description Detail
- Zweiter Description Term
- Zweites Description Detail
- Dritter Description Term
- Drittes Description Detail
Hier steht die Unterüberschrift
Vier oder mehr Paarungen, Auto layout
Bei vier oder mehr Elementen verteilen sich die Elemente vierspaltig im Auto layout.
- Erster Description Term
- Erstes Description Detail
- Zweiter Description Term
- Zweites Description Detail
- Dritter Description Term
- Drittes Description Detail
- Vierter Description Term
- Viertes Description Detail
- Fünfter Description Term
- Fünftes Description Detail
- Sechster Description Term
- Sechstes Description Detail
Hier steht die Unterüberschrift
Vier oder mehr Paarungen, Layout „3 cols“
Du kannst die automatische Spaltenaufteilung im Layout auch überschreiben, indem du eine andere Layoutvariante auswählst, wie hier die dreispaltige Aufteilung.
- Erster Description Term
- Erstes Description Detail
- Zweiter Description Term
- Zweites Description Detail
- Dritter Description Term
- Drittes Description Detail
- Vierter Description Term
- Viertes Description Detail
- Fünfter Description Term
- Fünftes Description Detail
- Sechster Description Term
- Sechstes Description Detail
Hier steht die Unterüberschrift
Theme & Hintergrund „Dunkel Brand“
Die IconDescriptionList kann natürlich auch im dunklen Theme dargestellt werden.
- Erster Description Term
- Erstes Description Detail
- Zweiter Description Term
- Zweites Description Detail
- Dritter Description Term
- Drittes Description Detail
- Vierter Description Term
- Viertes Description Detail
- Fünfter Description Term
- Fünftes Description Detail
- Sechster Description Term
- Sechstes Description Detail
Hier steht die Unterüberschrift
Theme & Hintergrund „Hell Beachy“
Das Text & Bilder Element kann natürlich auch auf dem BEACHY Hintergrund dargestellt werden.
- Erster Description Term
- Erstes Description Detail
- Zweiter Description Term
- Zweites Description Detail
- Dritter Description Term
- Drittes Description Detail
- Vierter Description Term
- Viertes Description Detail
- Fünfter Description Term
- Fünftes Description Detail
- Sechster Description Term
- Sechstes Description Detail