Untervarianten als weitere Dimension beim Einsatz von CSS-Only
13. Nov 2014
CSS-Only-Untervarianten ermöglichen eine erheblich flexiblere und umfangreichere Gestaltung rein über die Oberfläche und ganz ohne Inline-Styles.
CSS-Only-Untervarianten ermöglichen eine erheblich flexiblere und umfangreichere Gestaltung rein über die Oberfläche und ganz ohne Inline-Styles. Bestehende CSS-Only-Varianten lassen sich durch Untervarianten ergänzen, welche vom Benutzer auswählbar sind. So lassen sich neben fixen CSS-Only-Varianten unzählige Kombinationen vom Redakteur selbst erstellen.
Die Untervarianten selbst entsprechen dem gelernten CSS-Only-Prinzip. An bestehenden Varianten ändert sich nichts. Sie können zukünftig Variante, Untervarianten und beliebige Kombinationen anbieten. Auch bestehende Varianten lassen sich um Untervarianten im gewünschten Ausmaß erweitern. Es ist zum Beispiel möglich, eine Variante fix zu definieren, und den Redakteur nur aus drei als Untervariante definierten Hintergrundfarben auswählen zu lassen.
Aktivierte Untervarianten in der Hauptvariante 0 der für Inhaltsbereiche
/*@wCssFragment{class:elementSection;variant:0;caption:Standard;caption-en:Default}*/
.elementSection_var0 {-w-editmaskExtended-innerwidth:yes;-w-editmaskExtended-innerheight:no;-w-editmaskExtended-innerheight:yes;-w-editmaskExtended-backgroundcolor:yes;...
Beispiel von vordefinierten Hintergrundfarben als Untervarianten für Inhaltsbereiche
/*@wCssFragment{class:elementSectionBackgroundColor;variant:0;caption:Neutral;caption-en:Neutral}*/
.elementSectionBackgroundColor_var0 {background-color:$backgroundColorSectionBlank !important}
/*@wCssFragment{class:elementSectionBackgroundColor;variant:30;caption:Hell;caption-en:Highlighted}*/
.elementSectionBackgroundColor_var30 {background-color:$backgroundColorSectionColor1 !important}
/*@wCssFragment{class:elementSectionBackgroundColor;variant:60;caption:Dunkel;caption-en:Highlighted dark}*/
.elementSectionBackgroundColor_var60 {background-color:$backgroundColorSectionColor2 !important}
Nach und nach werden immer mehr Weblics mit Untervarianten ausgestattet. Da das Prinzip vollständig kompatibel zu den bekannten CSS-Only-Varianten ist, können Sie die erweiterten Möglichkeiten bei Bedarf nach einem Weblic-Update nutzen.