Sp:sass

Name

<sp:sass> - Kompiliert SASS Scripte

Syntax

<sp:sass
   name="variable"
   source="mycode"
   options="options"
/>

Beschreibung

Sass (Syntactically Awesome Stylesheets) ist eine Stylesheet-Sprache, die als Präprozessor die Erzeugung von Cascading Stylesheets erleichtert.

Dieser Tag nimmt Sass-Skripte entgegen, kompiliert sie in CSS. Der CSS-Code wird in einer Variable zur weiteren Verarbeitung abgelegt.

Attribute

Name	Type	Required	Default	ab IES Version
name	Variable	Ja	None	2.17
source	Attribute	Ja	None	2.17
options	Map	Ja	None	2.17

name

Name der Variable für den Zugriff auf das erzeugte CSS.

source

Text der das Sass-Skript enthält.

options

Die Optionen sind

outputStyle

nested, compact, expanded, compressed

includePath

Liste von Pfaden in denen nach SCSS-Scripten gesucht werden soll

precision

Genauigkeit von Mathematischen Rundungen

Beispiele

Textbild erzeugen

Template Quelltext

<sp:set name="_source">
$font-stack:    Helvetica, sans-serif;
$primary-color: #333;

body {
  font: 100% $font-stack;
  color: $primary-color;
}
</sp:set>

<sp:map name="_sassOptions" action="new"/>
<sp:map name="_sassOptions" action="put" key="outputStyle" value="compressed"/>
<sp:collection name="_sassOptions.includePath" action="add" value="${_base}node_modules/reset.css"/>
...

<sp:sass name="_styles" source="_source" options="_sassOptions"/>
<sp:print name="_styles"/>