Last Updated: February 25, 2016
·
500
· krzochalski

SASS good practices

Starting from... This is what I think and this is the way I do the job. And the pro-tip is not final, it's a kind of a draft. Feel free to express your comments.

Rule #1

Always stick to the rules!

Rule #2

If you can't, watch Rule #1

Rule #3

Each partial has max 100 lines. Yes, that's all. And if you can't make it shorter try .sass syntax instead of .scss. Refactor or divide the file into smaller ones.

Rule #4

Use indents wisely. Writing something huge with lots of intents inside may be cool, but not cool to read.

Rule #5

Using third party stylesheets, like jQuery UI? Convert them to SASS. Less connections are best connections. Put those all in /vendor then @import and be happy. And remember the Rule #3.

Rule #6

It comes to HTML this time, off topic. Use two spaces the adding classes to an element. For example:
<div class="pull-left image-container with-border">

Rule #7

Make all your imports in one place.

Rule #8

Write them a mini-glossary so everybody knows which folder and file contains what. Add contents to it every time you create a new partial.