Eigene Pflegemasken zu CSS-Only Untervarianten der Liste nutzen

Das Listen Weblic® unterstützt in aktueller Version seit CMS-Version 014.004.041.00 die Möglichkeit, eigene Pflegemasken für Untervarianten zu nutzen.

Listenoptionen mit CSS-Only Untervariante
Listenoptionen mit CSS-Only Untervariante

Im Screenshot nebenan wird zur Listen Hauptvariante "Standard (0)" aufgezeigt, wie die Nutzung einer eigenen Pflegemaske zur eigenen Untervariante "Spezieller Bildausschnitt" aussehen kann.

Dies ermöglicht es, ohne Duplizieren einer Hauptvariante nur  bestimmte Auswahlmöglichkeiten einer Untervariante für eine abweichende Darstellung zu nutzen. Das Beispiel finden Sie nachfolgend als Quelltextbeispiel angeführt.

Beispiel: Auszug aus der listDefault.scss - Individuelle Pflegemaske für eigene Untervariante zu Bild Seitenverhältnissen

/*@wCssFragment{class:listDefault;variant:0;caption:Standard;caption-en:Default}*/
.listDefault_var0 {

  /* ... */
  -w-editmaskExtendedWebtag-layoutMyAspectRatio:'active=yes,decorators=default,editor=selectCssClassVariant,cssClassMain=listDefault,cssClass=listDefaultMyAspectRatio,caption="Spezieller Bildausschnitt",captionInfo="abweichend zur Hauptvariante",onchange="wEditor.saveDraftAndReload();"';
  /* ... */
}

/* nachfolgend die zu obiger eigenen Pflegemaske vorstellbaren Varianten (Beispiele) */

/*@wCssFragment{class:listDefaultMyAspectRatio;variant:0;caption:Bild-Seitenverhältnis 16 / 9;caption-en:Picture AspectRatio 16 / 9;usertypes:;selectable:yes}*/
.listDefaultMyAspectRatio_var0 {
  -w-option-picture-aspectratio:1.777777; /* Seitenverhältnis Bild */
  -w-option-picture-mode:crop; /* Bildmodus [crop(Zugeschnitten auf Seitenverhältnis)|embed(Eingebettet)|default(Standard)]*/  
}

/*@wCssFragment{class:listDefaultMyAspectRatio;variant:1;caption:Bild-Seitenverhältnis 1 / 1;caption-en:Picture AspectRatio 1 / 1;usertypes:;selectable:yes}*/
.listDefaultMyAspectRatio_var1 {
  -w-option-picture-aspectratio:1; /* Seitenverhältnis Bild */
  -w-option-picture-mode:crop; /* Bildmodus [crop(Zugeschnitten auf Seitenverhältnis)|embed(Eingebettet)|default(Standard)]*/  
}

Ebenso ist es möglich, über die eigenen Pflegemasken auch weitere (eigene) Untervarianten anzusprechen, welche z.B. Data-Attribute setzen.