This configuration file overrides the default scss-lint config to enforce a coding style very similar to the way authors of the CSS specification write code in the W3C standards and drafts.
Authors of the specification write in various coding styles but some trends emerge out of the numerous code examples available.
I tried to formalize these trends and document them in this repository. Although the resulting configuration file can be used as a good base for your project, you should aim to override it with stricter linting rules to improve code quality.
Each linter rule is documented, mentionning when the W3C style hinders maintanability, grep-ability or readability, so you can make educated changes into your own configuration file.
Thanks to the authors of the spec and @sds for scss-lint.
http://www.w3.org/TR/CSS/
https://github.com/causes/scss-lint
Feel free to contribute if you see any errors or improvements.
First, you need scss-lint:
gem install scss-lint
To run scss-lint on your project, follow the instructions on: https://github.com/causes/scss-lint
I wrote an article detailing how we improved Sass code quality using scss-lint on theguardian.com. It details installation steps and how to automate linting with a Grunt task.
bower install scss-lint-w3c --save-dev
Add this line to your .scss-lint.yml configuration file:
inherit_from: 'bower_components/scss-lint-w3c/scss-lint-w3c.yml'Download scss-lint-w3c.yml into your project or clone this repository.
Add this line to your .scss-lint.yml configuration file:
inherit_from: 'path/to/scss-lint-w3c.yml'Your .scss-lint.yml configuration file should now look something like this:
# .scss-lint.yml
inherit_from: 'bower_components/scss-lint-w3c/scss-lint-w3c.yml'
# scss_files: 'app/assets/stylesheets/**/*.css.scss'
# exclude: 'app/assets/stylesheets/plugins/**'
# Your own linter configuration:
linters:
BorderZero:
enabled: false
Indentation:
exclude:
- 'path/to/file.scss'
- 'path/to/directory/**'
severity: warning
width: 2