Correction du trait de texte Webkit dans Sass

Question

J'utilise Sass pour générer mes feuilles de style CSS. Je veux une typographie cohérente, donc je veux utiliser les règles CSS de http://orderedlist.com/our-writing/resources/html-css/thinning-text-in-webkit-safari/ pour affiner le texte dans les navigateurs basés sur Webkit. Je pensais que ce serait faire l'affaire:

body 
    -webkit-text-stroke: 1px transparent 
@media only screen and (max-device-width:480px) 
    body 
    -webkit-text-stroke:0 black 

La première partie fonctionne très bien, mais la deuxième partie (l'exception pour Safari mobile) rend à

@media only screen and (max-device-width:480px) { } 

Hmm! Maintenant, apparemment, la prochaine version majeure de Sass supportera les parenthèses, donc je serai probablement capable de tomber dans la version CSS alors. Mais y a-t-il un moyen de faire ce que j'essaye de faire d'une manière proprement impertinente? J'ai déjà essayé d'échapper à la ligne @media only avec un \, mais cela a semblé faire que Sass ignore complètement cette section.

Answer 1

Vous devez avoir un espace entre le côlon et 0.

body 
    -webkit-text-stroke: 1px transparent 
@media only screen and (max-device-width:480px) 
    body 
    -webkit-text-stroke: 0 black 

L'espace disambiguates la syntaxe de la propriété de la syntaxe du sélecteur.