In einem ersten Teil stellte ich den Umgang mit den Stacks vor, die für die Spaltendarstellung der Webseite verantwortlich sind. In einem zweiten Teil befasste mit dem Site Styles Stack und den Swatches. Nachfolgend gehe ich auf Farbstile für die einzelnen Elemente einer Webseite ein:


Alternate Colors

Alt Color Styles in Foundation 6 Stacks:

Im Site Styles Stack werden u.a. die Farbeinstellungen der diversen Komponenten der Webseite festgelegt. Es gibt zusätzlich zu den übergeordneten Farbvorgaben ("Default Style") auch alternative Farbvorgaben ("Alternative Style") - dies kennt du vielleicht schon von Foundation 1. Sie dienen im Wesentlichen dazu, Farben selektiv zu definieren.

Die Verknüpfung zwischen zu konfiguriertem Inhalt und den Vorgaben im Site Styles Stack erfolgen über die benutzerdefinierte CSS-Klasse "alt". Dies funktioniert sowohl mit dem Bereich Component Colors, Text Colors, aber auch mit Swatches.

Bildquelle: Pexels