sass - wann zu verwenden und wenn nicht

Question

so ist es nicht genau eine "Code-Frage". es ist mehr über den Ansatz, es zu verwenden.

Ich habe dieses Design Psds und sie sagten, ich muss Sass verwenden. Ich bin ziemlich vertraut mit Sass seit einiger Zeit, und ich strukturierte es richtig in Ordnern, Vars was auch immer ...

meine Frage ist, wie weit muss ich damit gehen? Muss ich eveything in Variablen, Mixins und so weiter speichern, oder wenn ich es einfach in css bekommen möchte, weil es schneller für mein Gehirn ist, um die Idee zu verarbeiten, die ich hatte und es in sass refaktorisieren. Denn das schlägt den ganzen Zweck davon.

zum Beispiel habe ich dieses Symbol divs

.icons-bar .icon-item .icon-wrap { 
    width:100%; 
    height: 50px; 
    margin:auto;   
} 

die ich wie einfach verwenden können

.icons-bar .icon-item .icon-wrap:nth-child(1) { 
    background: url('../img/icons/icons-camera.png') no-repeat; 
    background-position: 50%;    
} 

.icons-bar .icon-item .icon-wrap:nth-child(2) { 
    background: url('../img/icons/icons-doctor.png') no-repeat; 
    background-position: 50%;    
} 

gegen einen mixin für sie zu schreiben und es

@mixin icon-make($icon) { 
    width:100%; 
    height: 50px; 
    margin:auto; 
    background: url('../img/icons/icons-' + $icon) no-repeat; 
    background-position: 50%; 

} 

nur eine einfache einschließlich Beispiel, in diesem Fall sage ich, dass es effizienter ist, einfach css mit Pseudos zu schreiben anstatt Zeit zu verschwenden, um ein Mixin zu machen. Irgendwelche Gedanken?

Answer 1

Ich denke, Sie sollten mit Sass beginnen, weil es mit der Organisation Ihrer CSS helfen wird, sobald Ihre Website in Produktion geht. Wenn ein anderer Entwickler hinter Ihnen herkommt und versucht, an Ihren Sass-Dateien zu arbeiten (das sind Strukturen in Variablen, Mixins, Teile der Site, etc.), dann wird es ihnen leichter sein, die Sass-Dateien zu modifizieren und dann hineinzugehen eine große CSS-Datei und versuchen zu finden, wo alles ist.

Answer 2

Wenn ich es richtig verstanden habe, sprechen Sie über OOCSS (erste Probe) vs Smacss/Bem.

Bem Modifikator könnte eine bessere Wahl (mit bestimmten Klassennamen) sein für die Aufrechterhaltung wäre es

sein

<span class="footer__icon footer__icon--camera"></span> 
<span class="footer__icon footer__icon--doctor"></span> 

Selbst Code dokumentiert. Wenn Sie das HTML lesen, können Sie die Idee, wie Sass organisiert bekommen

Über Variablen, NEIN, müssen Sie nicht alle von ihnen speichern