bjankord / Stylelint Config Sass Guidelines
Licence: mit
⚙ A stylelint config inspired by https://sass-guidelin.es/
Stars: ✭ 349
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Stylelint Config Sass Guidelines
Generator Dhboilerplate
Boilerplate made by David Hellmann
Stars: ✭ 54 (-84.53%)
Mutual labels: stylelint, scss
React 2048 Game
🎮 A fancy 2048 game build with react, redux best practices.
Stars: ✭ 401 (+14.9%)
Mutual labels: stylelint, scss
Stylelint Config Recommended Scss
The recommended shareable SCSS config for stylelint
Stars: ✭ 141 (-59.6%)
Mutual labels: stylelint, scss
Stylelint Scss
A collection of SCSS specific linting rules for stylelint
Stars: ✭ 655 (+87.68%)
Mutual labels: stylelint, scss
Frasco
Quick starter for Jekyll including full setup for Sass, PostCSS, Autoprefixer, stylelint, Webpack, ESLint, imagemin, Browsersync, etc.
Stars: ✭ 123 (-64.76%)
Mutual labels: stylelint, scss
Nextjs Ts
Opinionated Next JS project boilerplate with TypeScript and Redux
Stars: ✭ 134 (-61.6%)
Mutual labels: stylelint, scss
Vscode Stylelint
A Visual Studio Code extension to lint CSS/SCSS/Less with stylelint
Stars: ✭ 260 (-25.5%)
Mutual labels: stylelint, scss
Devportfolio
A lightweight, customizable single-page personal portfolio website template built with JavaScript and Sass
Stars: ✭ 3,582 (+926.36%)
Mutual labels: scss
Letra Extension
Passively learn a new language every time you open a new tab
Stars: ✭ 323 (-7.45%)
Mutual labels: scss
Yo
Lightweight, easy-to-use, configurable, and extensible mobile front-end development framework.
Stars: ✭ 319 (-8.6%)
Mutual labels: scss
Papercss
PaperCSS was originally made by @rhyneav to be something different than the typical mODerN STylEs and clean pages found in every other CSS framework. It was built with LESS and deployed on a single index.html page before being open sourced. It has since evolved; The CSS source has been rewritten in SCSS and the documentation is now built with Hugo (all thanks to some wonderful contributors). In addition to the original creator, it is maintained by @Fraham and @TotomInc.
Stars: ✭ 3,539 (+914.04%)
Mutual labels: scss
Rust Ffi Omnibus
A collection of examples of using code written in Rust from other languages
Stars: ✭ 344 (-1.43%)
Mutual labels: scss
Restool
RESTool is an open source UI tool for managing RESTful APIs. It could save you time developing your own internal tools. A live example:
Stars: ✭ 338 (-3.15%)
Mutual labels: scss
Pug Starter
Simple pug (jade) starter [framework] enabling faster delivery of HTML & CSS projects to a private server and/or automatic deployment of GitHub pages.
Stars: ✭ 328 (-6.02%)
Mutual labels: scss
stylelint-config-sass-guidelines
A stylelint config inspired by sass-guidelin.es.
This linter has been designed / tested with SCSS syntax based on the SCSS guidelines documented in https://sass-guidelin.es/. It is intended for use with SCSS syntax, not Sass (tab style) syntax.
Translations
Installation
$ npm i -D stylelint stylelint-config-sass-guidelines
Usage
Set your stylelint config to:
{
"extends": "stylelint-config-sass-guidelines"
}
Extending the config
Simply add a "rules"
key to your config and add your overrides there.
For example, to change the indentation
to tabs and turn off the number-leading-zero
rule:
{
"extends": "stylelint-config-sass-guidelines",
"rules": {
"indentation": "tab",
"number-leading-zero": null
}
}
Lint Rule Comparison
Lint Report Comparison
Documentation
Plugins
-
stylelint-order
: A plugin pack of order related linting rules for stylelint. -
stylelint-scss
: A collection of SCSS specific linting rules for stylelint
Configured lints
This is a list of the lints turned on in this configuration, and what they do.
At-rule
-
at-rule-disallowed-list
: Specify a list of disallowed at-rules.-
"debug"
Disallow the use of@debug
.
-
-
at-rule-no-vendor-prefix
: Disallow vendor prefixes for at-rules.
Block
-
block-no-empty
: Disallow empty blocks. -
block-opening-brace-space-before
: There must always be a single space before the opening brace.
Color
-
color-hex-case
: Hex colors must be written in lowercase. -
color-hex-length
: Always use short hex notation, where available. -
color-named
: Colors must never be named. -
color-no-invalid-hex
: Hex values must be valid.
Declaration
-
declaration-bang-space-after
: There must never be whitespace after the bang. -
declaration-bang-space-before
: There must always be a single space before the bang. -
declaration-colon-space-after
: There must always be a single space after the colon if the declaration's value is single-line. -
declaration-colon-space-before
: There must never be whitespace before the colon.
Declaration block
-
declaration-block-properties-order
: Properties in declaration blocks must be sorted alphabetically. -
declaration-block-semicolon-newline-after
: There must always be a newline after the semicolon. -
declaration-block-semicolon-space-before
: There must never be whitespace before the semicolons. -
declaration-block-single-line-max-declarations
: There should never be more than1
declaration per line. -
declaration-block-trailing-semicolon
: There must always be a trailing semicolon.
Declaration Property
-
declaration-property-value-disallowed-list
: Specify a list of disallowed property and value pairs within declarations.-
^border
: Disallow the use of the wordnone
for borders, use0
instead. The intent of this rule is to enforce consistency, rather than define which is "better."
-
Function
-
function-comma-space-after
: There must always be a single space after the commas in single-line functions. -
function-parentheses-space-inside
: There must never be whitespace on the inside of the parentheses of functions. -
function-url-quotes
: URLs must always be quoted.
General
-
indentation
: Indentation should always be2
spaces. -
length-zero-no-unit
: Disallow units for zero lengths. -
max-nesting-depth
: Limit the allowed nesting depth to1
. Ignore: Nested at-rules@media
,@supports
, and@include
. -
no-missing-eof-newline
: Disallow missing end-of-file newlines in non-empty files.
Media Feature
-
media-feature-name-no-vendor-prefix
: Disallow vendor prefixes for media feature names.
Number
-
number-leading-zero
: There must always be a leading zero. -
number-no-trailing-zeros
: Disallow trailing zeros in numbers.
Property
-
property-no-vendor-prefix
: Disallow vendor prefixes for properties. -
shorthand-property-no-redundant-values
: Disallow redundant values in shorthand properties.
Rule
-
rule-nested-empty-line-before
: There must always be an empty line before multi-line rules. Except: Nested rules that are the first of their parent rule. Ignore: Rules that come after a comment. -
rule-non-nested-empty-line-before
: There must always be an empty line before multi-line rules. Ignore: Rules that come after a comment.
SCSS
-
at-extend-no-missing-placeholder
: Disallow at-extends (@extend
) with missing placeholders. -
at-function-pattern
: SCSS functions must be written in lowercase and match the regex^[a-z]+([a-z0-9-]+[a-z0-9]+)?$
. -
at-import-no-partial-leading-underscore
: Disallow leading underscore in partial names in@import
. -
at-import-partial-extension-blacklist
: Specify list of disallowed file extensions for partial names in@import
commands.-
.scss
: Disallow the use of the.scss
file extension in imports.
-
-
at-mixin-pattern
: SCSS mixins must be written in lowercase and match the regex^[a-z]+([a-z0-9-]+[a-z0-9]+)?$
. -
dollar-variable-colon-space-after
: Require a single space after the colon in $-variable declarations. -
dollar-variable-colon-space-before
: Disallow whitespace before the colon in $-variable declarations. -
dollar-variable-pattern
: SCSS variables must be written in lowercase and match the regex^[a-z]+([a-z0-9-]+[a-z0-9]+)?$
. -
percent-placeholder-pattern
: SCSS%
-placeholders must be written in lowercase and match the regex^[a-z]+([a-z0-9-]+[a-z0-9]+)?$
. -
selector-no-redundant-nesting-selector
: Disallow redundant nesting selectors (&
).
Selector
-
selector-class-pattern
: Selectors must be written in lowercase and match the regex^(?:u|is|has)-[a-z][a-zA-Z0-9]*$|^(?!u|is|has)[a-zA-Z][a-zA-Z0-9]*(?:-[a-z][a-zA-Z0-9]*)?(?:--[a-z][a-zA-Z0-9]*)?$
. -
selector-list-comma-newline-after
: There must always be a newline after the commas of selector lists. -
selector-max-compound-selectors
: Limit the number of compound selectors in a selector to3
. -
selector-no-id
: Disallow id selectors. -
selector-no-qualifying-type
: Disallow qualifying a selector by type. -
selector-no-vendor-prefix
: Disallow vendor prefixes for selectors. -
selector-pseudo-element-colon-notation
: Applicable pseudo-elements must always use the double colon notation. -
selector-pseudo-element-no-unknown
: Disallow unknown pseudo-element selectors.
String
-
string-quotes
: Strings must always be wrapped with single quotes.
Stylelint Disable Comment
-
stylelint-disable-reason
: Require a reason comment before stylelint-disable comments.
Value
-
value-no-vendor-prefix
: Disallow vendor prefixes for values.
Changelog
License
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].