28172 sujets

CSS et mise en forme, CSS3

[Résolu] Code propre

Bonjour les dev Smiley smile

petite question du jour, existe t'il un plugin pour brackets ou sublime text qui permette d'ordonner les CSS ? J'avoue partir toujours avec la bonne intention de faire un code aussi propre qu'un bloc d'opération mais ça fini toujours en scène gore et quand les projets s'allongent on a tendance à expédier (je sais c'est mal) les choses sans réordonner l'ensemble.

Au cas où il existerait un p'tit module permettant de faire le boulot à ma place je crierai la joie Smiley lol sinon bah on va tenter de prendre une magnifique résolution.

Bonne journée
Administrateur
Hello,

Pour Brackets, je te conseille "CSScomb Brackets plugin" que j'utilise quotidiennement pour ordonner les propriétés, ainsi que "Brackets Beautify" our dé-indenter tout proprement.

Les équivalents doivent exister pour SublimeText.
Administrateur
Bonjour,

sinon il y a stylelint mais il faut désactiver la moitié des règles (boulot fastidieux même s'il n'est nécessaire qu'une seule fois) si tu ne veux pas devenir chèvre avec 350 warnings et erreurs de style dont la moitié ont très peu d'importance (l'outil est vraiment bête et méchant : jamais de ligne vide entre ceci et cela, toujours une ligne vide entre là et là, raaah mais c'est ce qu'on lui demande)
Oui beautify je l'utilise beaucoup. En fait je pensais un truc qui prend par exemple : 


.content h2 {color:#000}
.footer {background:#fff}
.content h1 {color:#456}


et me fait 

.content h1 {color:#456}
.content h2 {color:#000}
.footer {background:#fff}


Genre un tri alphabétique (oui oui j'ai le droit de rêver un peu).
Modifié par letty (01 Dec 2016 - 12:25)
Bonjour.

Quand on veut avoir du sur-mesure, il faut faire ses propres outils... ou s'astreindre à plus de discipline (mais c'est peut-être moi qui ne rêve pas assez....)

Smiley smile
Administrateur
letty a écrit :
Genre un tri alphabétique (oui oui j'ai le droit de rêver un peu).

CSScomb effectue un tri sur les propriétés (alphabétique ou non), ce qui est déjà très bien.

Il ne trie pas les règles entières, mais sincèrement je ne serai pas trop fan de remplacer le premier code par le second :

html {
}
body {
}
header {
}
.content {
}
footer {
}


.content {
}
body {
}
header {
}
html {
}
footer {
}


Smiley eek
Je ne pense pas que le classement par ordre alphabétique soit une très bonne chose. En effet, en CSS, pour deux sélecteurs de poids égal c'est le dernier qui l'emporte, il y aurait donc des effets difficiles à prévoir (déjà qu'en soit, la cascade...).

Exemple pour ce code html :
<p class="premier-el deuxieme-el">Le texte à colorer.</p>

Imaginons qu'en css nous voulions ceci, pour avoir une couleur bleue au surclassement :
.premier-el {color : Red}
.deuxieme-el {color : Blue}

Votre réorganisation donnerait ceci :
.deuxieme-el {color : Blue}
.premier-el {color : Red}

Et donc une couleur rouge...
Modifié par Olivier C (01 Dec 2016 - 16:03)
Mon exemple alphabétique était mauvais, mais c'était dans l'esprit Smiley smile Bon je comprends donc qu'il va falloir que je sois plus minutieuse et rester sur ma ligne de conduite sans céder à la panique. Merci en tout cas pour vos retour.
Modifié par letty (01 Dec 2016 - 16:35)
Sujet clos
Aller à