SCSS

[Racktor]

C 'est quoi SCSS ?

C'est un préprocesseur CSS. Une surcouche qui permet d'organiser ses CSS en utilisant des variables, des boucles, des structures conditionnelles, des fonctions, etc. Ce "micro-langage" est compilé pour donner un fichier CSS tout ce qu'il y a de plus classique. Je l'utilise depuis quelques mois et j'avoue que c'est assez ultime : je ne pourrais plus m'en passer

Connais tu un tuto (fr au mieux) sur ca ?

[Sephi-Chan]

Tu pourrais prendre la peine de chercher SCSS sur Google quand même… -_-

[Racktor]

Non mais chercher c'est pas un problème mais si quelqu'un connais un tuto pour un débutant en fr, perso je prends ...
PS : c'est normal qu'on me parle de framework compass ?

[Xenos]

Tu pourrais prendre la peine de chercher SCSS sur Google quand même… -_-

SCSS:

Select Comfort Corp.
NASDAQ: SCSS - 21 août 10:07 ET
22.25+0.30‎ (1.37%‎)

Ca ne va pas l'aider de chercher de but en blanc :p (ok, là je troll un peu)

Redevenons plus sérieux.

des boucles, des structures conditionnelles,

Là, en revanche, je suis très sceptique... Déjà, je ne l'ai pas vu sur le site de SASS, mais surtout, je ne vois pas comment le CSS de sortie pourrait émuler les if et les boucles.

Ca sent l'topic qui dérive \o/

[Sephi-Chan]

Je sépare le sujet pour éviter tout problème de dérive.

des boucles, des structures conditionnelles,

Là, en revanche, je suis très sceptique... Déjà, je ne l'ai pas vu sur le site de SASS, mais surtout, je ne vois pas comment le CSS de sortie pourrait émuler les if et les boucles.

Les conditions sont résolues à la compilation.

[Racktor]

Comme entré en matière ce tuto est bon ?

[Sephi-Chan]

Ça a l'air. Le plus délicat n'est pas d'apprendre à utiliser SCSS, c'est de l'intégrer à ton worflow.

Déjà, utiliser SCSS et/ou Compass d'installer Ruby sur ta machine. Si tu es sous Linux c'est trivial, sous Mac OS X c'est déjà fait, et sous Windows c'est un poil plus compliqué (selon ta débrouillardise et/ou ta capacité à chercher de l'aide).

Ensuite, il faut permettre de compiler simplement les fichiers SCSS en un fichier CSS (pour pouvoir tester le rendu dans un navigateur). On peut le faire via la commande sass (c'est le plus simple) ou en installant un plugin dans ton éditeur de texte (selon ce que c'est).


Visiblement, des outils comme Scout peuvent t'aider. Tu devrais peut-être commencer par ça.

[Racktor]

Faut déja que je regarde tout ca, les tuto sur le site de Xenos (en anglais ca va être coton mais bon ...).

[Xenos]

Ok, c'est des conditions résolues "à la compilation", pas en temps réel (dommage...)

Finalement, je reste sur mon système perso :p N'ayant besoin que d'alias de nom et de variables, je préfère avoir un fichier PHP à qui j'envoie l'URL du "CSS étoffé", ce PHP me renvoie alors le contenu comme réponse HTTP et sauve également le CSS (minimifié) dans un fichier *.css. Ouais, "je réinvente la roue", mais je me prends moins la tête à faire 1 script qu'à me farcir toute l'installation et la doc pour Windows...
Bon, ok, j'ai dévié, mais je me ferai pardonner un jour, plus tard, quand je passerai ce script en Open Source .

[Sephi-Chan]

Avec Scout tu n'as rien d'autres à installer.

La fonctionnalité la plus utilisée (car on s'en sert sans s'en rendre compte) est l'encapsulation. Les variables sont également très utiles, ainsi que les mixins. Le reste est cool mais plus situationnel.

Compass s'appuie d'ailleurs sur ces mixins pour te permettre de t'abstraire des préfixes spécifiques à chaque navigateur.

Compass permet également de générer des sprites CSS automatiquement : à partir d'un dossier contenant les images sources, il crée l'image unique et une classe CSS pour chaque image. On peut également automatiquement remplacer l'URL d'une image de background par son équivalent Base64 (très pratique pour les images qu'on ne peut pas intégrer dans un sprite comme les dégradés qui se répètent).


Quelle idée de développer sous Windows. ^^