diff options
| author | Jacob Schatz <jschatz1@gmail.com> | 2016-03-23 21:13:14 +0000 |
|---|---|---|
| committer | Jacob Schatz <jschatz1@gmail.com> | 2016-03-23 21:13:14 +0000 |
| commit | 31ba9c303bfec5f7ca440067b463126af8f41394 (patch) | |
| tree | b33b5e72b91960feeafe1a0fd38a5acb1f6874d9 | |
| parent | 4798b927ab76583024c67beb43e2fa0e3ffdbf44 (diff) | |
| parent | 2c9f6cfa4284a584a87d80fea53517f4a46bfabe (diff) | |
| download | gitlab-ce-31ba9c303bfec5f7ca440067b463126af8f41394.tar.gz | |
Merge branch 'scss-style-guide-fixes' into 'master'
Documentation: SCSS Style Guide fixes
Fixed a typo and added a section on ignoring issues.
[ci skip]
See merge request !3263
| -rw-r--r-- | doc/development/scss_styleguide.md | 27 |
1 files changed, 24 insertions, 3 deletions
diff --git a/doc/development/scss_styleguide.md b/doc/development/scss_styleguide.md index 6c48c25448b..a79f4073cde 100644 --- a/doc/development/scss_styleguide.md +++ b/doc/development/scss_styleguide.md @@ -72,9 +72,9 @@ p { margin: 0; padding: 0; } ### Colors -HEX (hexadecimal) colors short-form should use shortform where possible, and -should use lower case letters to differenciate between letters and numbers, e. -g. `#E3E3E3` vs. `#e3e3e3`. +HEX (hexadecimal) colors should use shorthand where possible, and should use +lower case letters to differentiate between letters and numbers, e.g. `#E3E3E3` +vs. `#e3e3e3`. ```scss // Bad @@ -160,6 +160,7 @@ is slightly more performant. ``` ### Selectors with a `js-` Prefix + Do not use any selector prefixed with `js-` for styling purposes. These selectors are intended for use only with JavaScript to allow for removal or renaming without breaking styling. @@ -187,8 +188,28 @@ CSSComb globally (system-wide). Run it in the GitLab directory with Note that this won't fix every problem, but it should fix a majority. +### Ignoring issues + +If you want a line or set of lines to be ignored by the linter, you can use +`// scss-lint:disable RuleName` ([more info][disabling-linters]): + +```scss +// This lint rule is disabled because the class name comes from a gem. +// scss-lint:disable SelectorFormat +.ui_charcoal { + background-color: #333; +} +// scss-lint:enable SelectorFormat +``` + +Make sure a comment is added on the line above the `disable` rule, otherwise the +linter will throw a warning. `DisableLinterReason` is enabled to make sure the +style guide isn't being ignored, and to communicate to others why the style +guide is ignored in this instance. + [csscomb]: https://github.com/csscomb/csscomb.js [node]: https://github.com/nodejs/node [npm]: https://www.npmjs.com/ [scss-lint]: https://github.com/brigade/scss-lint [scss-lint-documentation]: https://github.com/brigade/scss-lint/blob/master/lib/scss_lint/linter/README.md +[disabling-linters]: https://github.com/brigade/scss-lint#disabling-linters-via-source |