Organiser le CSS - Githubissues

Lucas-Moreno / webdoc-BlockChain

0 stars 0 forks source link

Organiser le CSS #12

Open bcalou opened 4 years ago

bcalou commented 4 years ago

Actuellement le CSS n'est pas très bien organisé, vous avez plusieurs choix :

Mettre le CSS de chaque composant dans le fichier correspondant
Utiliser des fichiers globaux (comme actuellement) mais avec une convention type BEM. Pour l'instant c'est le bazar (home.scss par exemple ne devrait contenir que des classes commençant par "home")

RemiTiab commented 4 years ago

C'est fait, nous utiliserons donc des fichiers globaux.

Merci Bastien !

bcalou commented 4 years ago

Alors c'est mieux, mais c'est quand même loin d'être parfait car chaque fichier utilise une convention différente : des IDs, BEM, pas BEM... Il faut uniformiser. Par exemple header.scss avec sa convention BEM est propre. Dans un fichier BEM, toutes les classes devraient commencer par le nom du fichier et être très peu imbriquées. Si je prend un fichier comme home.scss par contre, c'est le bazar

RemiTiab commented 4 years ago

Hello Bastien,

J'utilise que des classes pour custom le CSS des éléments;

Dans mon fichier home j'ai mon wrapper > home > puis tout les éléments de home qui sont bien nommé "home__xxxx";

Concernant les éléments imbriqué j'essaye de faire au maximum 3 éléments pas plus.

D'autres conseils pour uniformiser et rendre plus propres nos fichiers ?

Merci d'avance :)

bcalou commented 4 years ago

On est encore loin du BEM : au lieu d'avoir .wrapper--home (qui ne marche pas en tant que classe BEM, les tirets c'est pour les modifiers) et .home dedans, inverse :

.home > .home__inner

Ton wrapper devient ta classe principale.

Je passerai mardi pour le reste car c'est un peu difficile à expliquer par écrit, mais ça n'est que de l'organisation, ça ne vous empêche pas de continuer !