Styles in Stylesets zusammenfassen

Was ist ein Styleset?

Ein Styleset ist eine Sammlung von Styles und Selektoren, die man einzelnen Modulen zuweisen kann. Das macht Layouts übersichtlicher und hilft dabei, die Anzahl der Styles zu reduzieren.

    Wie erstelle ich ein Styleset?

    Für das Erstellen eines Stylesets verwendet man das Modul "Styleset". Man kann dieses an beliebiger Stelle in ein Layout einfügen. Wir empfehlen aber, Styleset-Module aus Gründen der Übersichtlichkeit direkt unterhalb des Basismoduls zu platzieren. Das Modul darf nur Styles oder weitere Styleset-Module enthalten. Andere Module kann man zwar einfügen, werden aber ingnoriert.

    Wichtig: Man muss dem Styleset einen Namen geben, ansonsten kann man es nicht anderen Modulen zuweisen.

    Wie verwende ich ein Styleset?

    Für die Zuweisung eines Stylesets zu einem Modul, gibt es den Style(!) "Styleset". Man kann diesen in ein beliebiges Modul einfügen und wählt dort den gewünschten Style aus. Wenn man die Taste "STRG" hält, kann man mehrere Stylesets durch Mausklick auswählen.

    Stylesets können Modulen nur direkt zugewiesen werden. Man kann den Style "Styleset" nicht in einen Selektor einfügen.

    Stylesets organisieren

    Man kann Stylesets für eine bessere Übersicht ineinander schachteln. Im Screenhost unten sieht man das Styleset "Button". In diesem sind die grundsätzlichen Styles für einen Button wie runde Ecken, Rahmen, Abstände etc. definiert. Darunter liegen zwei weitere Stylesets: "Button blau" und "Button schwarz". Diese enthalten jeweils nur einen Style "Hintergrund-Farbe" mit unterschiedlichen Werten.

    Bei der Auswahl der Stylesets wird diese Struktur ebenfalls angezeigt. Um das Link-Modul z.B. als blauen Button erscheinen zu lassen, muss man sowohl das Styleset "Button" wie auch das Styleset "Button blau" anwählen.

    Hinweis: Die hierarchische Anordung ist lediglich eine Hilfe bei der Strukturierung der Stylesets. Es werden nicht automatisch die Styles aller darüberliegenden Stylesets mit zugewiesen. Um beim untenstehenden Beispiel zu bleiben: Wenn man nur den Style "Button blau" auswählt, wird lediglich eine blaue Hintergrundfarbe gesetzt, nicht die Styles des Sets "Button".

    Einschränkungen

    Ereignisse und Zustandsselektoren, die sich auf Ereignisse beziehen sowie die Styles "Hintergrund-Video" und "Scroll-In Animation" funktionieren aus technischen Gründen leider nicht in Stylesets. Diese müssen weiterhin direkt einem Modul zugewiesen werden.

    Demo-Projekt

    Ein kleines Demo-Projekt mit Stylesets könnt ihr durch Klick auf den unten stehenden Button herunterladen und in euren rukzuk-Space importieren.

    Built with pride in rukzuk © 2015 rukzuk AG