Sass. Backslash-Unicode-Character. Obskure Quadrate (in kompilierter CSS-Datei)
Die Sass-Community ist stur. Am Beispiel Font-Awesome: Definiert man eine Variable $fa-var-accessible-icon: \f368;
und setzt die ins SCSS, z.B. content: fa-content($fa-var-accessible-icon);
kommt im CSS (meist) ein gequotetes Quadrat raus (content: "□";
) , wenn man im Texteditor anschaut, anstatt content: "\f368";
. Zwar funktioniert das CSS, aber eben schwer nachvollziehbar, was da nun content:
ist.
Sassler wollen nicht verstehen, dass das ein wichtiger Punkt im täglichen Webdesign ist, da auch die Browser-Inspektoren das Quadrat anzeigen. Es ist müßig sich die jahre-alten Diskussionen durchzulesen und die Daumen-runter zu zählen, die sich Sass-Macher-Professoren mit diesem Missstand schon eingehandelt haben... Eine SASS-Konfiguration habe ich dagegen nicht gefunden. Mag sein...
Den einzigen Hack den ich gefunden habe ist:
Definiere die Variable ohne Backslash:
$fa-var-accessible-icon: f368;
Erstelle eigene Funktion:
@function backslasher($string)
{
@return unquote("\"") + unquote(str-insert($str, "\\", 1)) + unquote("\"");
}
Function geklaut von: https://stackoverflow.com/questions/30421570/sass-unicode-escape-is-not-preserved-in-css-file
Und verwende statt content: fa-content(...);
content: backslasher($fa-var-accessible-icon);
Dann kommt im CSS raus:
content: "\f368";
Bescheuert aber wahr.