ncoden/SCSS.md

## SCSS.md

      
    Raw
  

              SCSS.md
            
          
    #Objectif
L'objectif est d'avoir une structure CSS modulaire et sémantique. On utilise un ensemble de composants BEM. Le layout n'est composé que d'eux, vidé de tout "utilitaires".
#Composants
En plus d'adopter une approche BEM, l'ensemble des composants doivent:

être modulaires. Pas plus de 2 niveaux de profondeur (= 1 block, 1 élément)
être orientés objets. Pas d'utilitaires
proposer une structure, des skins et des modifiers séparés, sous forme de classes/%placeholders/@mixins

Les composants génériques doivent:

gérer leur propre propriétés uniquement (pas de margin, float, width...), sans cas particuliers

Les composants du layout doivent:

regrouper à leur niveau l'ensemble des cas particuliers, ou spécifiques à un breakpoint
si possible, ne gérer ces cas particuliers qu'en faisant appel à des modifiers

#Frameworks
Bootstrap

Bootstrap n'est pas adapté à l'approche BEM. En plus de ne pas du tout être modulaire, il n'utilise Sass que comme un outil de génération, sans proposer d'autres @mixins que ceux utilisés en interne.
Conclusion: C'est mort.
Foundation

Foundation a l'avantage d'avoir une grande communauté et d'être orienté Sass (Propose un ensemble de %placeholders et @mixins pour chaque composant). Mais le skin est intégré, ce qui pose les mêmes problêmes de maintenance que BS.
Conclusion: Migration plus facile, mais pose des problêmes sur le long terme (overwrite du skin)
Bourbon (& cie)

Edit: Bourbon ne propose une lib de composants que pour l'environnement Rails.

Bourdon est également orienté Sass, mais aussi ultra-modulaire, et propose une lib de mixins très complête et une lib de composants (Refills) disponibles sans skin (http://empties.bourbon.io/). Il y a une assez bonne communauté autour de Bourbon et Refills, mais Empties semble assez mal connu.


Conclusion: Migration plus difficile, mais permettant d'avoir une vrai approche BEM modulaire et sémantique. En gros, ultra-maintenable