Veltrup: /* Syntax */

2017-07-25T09:27:03Z

Syntax

Veltrup: Die Seite wurde neu angelegt: „==Name== - Kompiliert SASS Scripte ==Syntax==
2016-08-02T11:41:36Z

Die Seite wurde neu angelegt: „==Name== <sp:sass> - Kompiliert SASS Scripte ==Syntax== <source lang="xml"> <sp:compasscompiler name="variable" source="mycode" options="options" /> </s…“

Neue Seite
==Name==
<sp:sass> - Kompiliert SASS Scripte

==Syntax==
<source lang="xml">
<sp:compasscompiler
name="variable"
source="mycode"
options="options"
/>
</source>

==Beschreibung==
[http://sass-lang.com/ 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==
{| class="prettytable sortable"
|- class="hintergrundfarbe1"
! Name || Type || Required || Default || ab IES Version
|-
| <code>name</code>
| [[Variable]]
| Ja
| None
| 2.17
|-
| <code>source</code>
| [[Attribute]]
| Ja
| None
| 2.17
|-
| <code>options</code>
| [[Map]]
| Ja
| None
| 2.17
|}

;<code>name</code>
:Name der Variable für den Zugriff auf das erzeugte CSS.

;<code>source</code>
:Text der das Sass-Skript enthält.

;<code>options</code>
: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
<source lang="xml">
<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"/>
</source>

<noinclude>
[[Category:SP-Tags]]
[[Category:Qualität_des_Codes_prüfen]]
[[Category:Beispiel_überarbeiten_testen]]
</noinclude>

@@ Zeile 4: / Zeile 4: @@
 ==Syntax==
 <source lang="xml">
-<sp:compasscompiler
+<sp:sass
     name="variable"
     source="mycode"