Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
G
gitlab-ce
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
Analytics
Analytics
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Commits
Issue Boards
Open sidebar
Boxiang Sun
gitlab-ce
Commits
2c9f6cfa
Commit
2c9f6cfa
authored
Mar 23, 2016
by
connorshea
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
SCSS Style Guide fixes.
Fix a typo and add a section on ignoring issues. [ci skip]
parent
4798b927
Changes
1
Show whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
24 additions
and
3 deletions
+24
-3
doc/development/scss_styleguide.md
doc/development/scss_styleguide.md
+24
-3
No files found.
doc/development/scss_styleguide.md
View file @
2c9f6cfa
...
@@ -72,9 +72,9 @@ p { margin: 0; padding: 0; }
...
@@ -72,9 +72,9 @@ p { margin: 0; padding: 0; }
### Colors
### Colors
HEX (hexadecimal) colors sho
rt-form should use shortform where possible, and
HEX (hexadecimal) colors sho
uld use shorthand where possible, and should use
should use lower case letters to differenciate between letters and numbers, e.
lower case letters to differentiate between letters and numbers, e.g.
`#E3E3E3`
g.
`#E3E3E3`
vs.
`#e3e3e3`
.
vs.
`#e3e3e3`
.
```
scss
```
scss
// Bad
// Bad
...
@@ -160,6 +160,7 @@ is slightly more performant.
...
@@ -160,6 +160,7 @@ is slightly more performant.
```
```
### Selectors with a `js-` Prefix
### Selectors with a `js-` Prefix
Do not use any selector prefixed with
`js-`
for styling purposes. These
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
selectors are intended for use only with JavaScript to allow for removal or
renaming without breaking styling.
renaming without breaking styling.
...
@@ -187,8 +188,28 @@ CSSComb globally (system-wide). Run it in the GitLab directory with
...
@@ -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.
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
[
csscomb
]:
https://github.com/csscomb/csscomb.js
[
node
]:
https://github.com/nodejs/node
[
node
]:
https://github.com/nodejs/node
[
npm
]:
https://www.npmjs.com/
[
npm
]:
https://www.npmjs.com/
[
scss-lint
]:
https://github.com/brigade/scss-lint
[
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
[
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
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment