DanielaValero · August 20, 2024 11:27 · Jul 12, 2016 · Jul 12, 2016
diff --git a/stylelint.config.js-airbnb → stylelint.config-airbnb.js b/stylelint.config.js-airbnb → stylelint.config-airbnb.js
diff --git a/stylelint.config.js-airbnb b/stylelint.config.js-airbnb
@@ -0,0 +1,145 @@
+/**
+ * Default configuration to lint
+ * the airbnb css style-guide.
+ * This file is taken from a pull request to Airbnb/css repo
+ * which intends to create a default preset that can be used
+ * in the future. Until it is merged, we will have the config here.
+ * https://github.com/airbnb/css/pull/23
+ * Add more rules: http://stylelint.io/user-guide/rules/
+ * Also, to understand better who the rules are named:
+ * http://stylelint.io/user-guide/about-rules/
+ * For an extended sample of config, check this out
+ * http://stylelint.io/user-guide/example-config/
+ */
+export default {
+  plugins: [
+    'stylelint-scss',
+    'stylelint-selector-bem-pattern',
+  ],
+  rules: {
+    /* ==========================================================================
+       Airbnb config
+       ========================================================================== */
+
+    // CSS formatting
+    'selector-no-id': true,
+    indentation: 2,
+    'selector-list-comma-newline-after': 'always',
+    'declaration-colon-space-after': 'always',
+    'declaration-colon-space-before': 'never',
+    'block-opening-brace-space-before': 'always',
+    'declaration-block-single-line-max-declarations': 1,
+    'rule-nested-empty-line-before': ['always', {
+      ignore: ['after-comment'],
+    }],
+    'rule-non-nested-empty-line-before': ['always', {
+      ignore: ['after-comment'],
+    }],
+
+    // Comments
+    'comment-empty-line-before': ['always', {
+      ignore: ['stylelint-commands'],
+    }],
+
+    // Bem
+    'plugin/selector-bem-pattern': {
+      componentName: '[A-Z]+',
+      componentSelectors: {
+        initial: '^\\.{componentName}(?:-[a-z]+)?$',
+        combined: '^\\.combined-{componentName}-[a-z]+$',
+      },
+      utilitySelectors: '^\\.util-[a-z]+$',
+    },
+
+    // Border
+    'declaration-property-value-blacklist': {
+      '/^border/': ['none'],
+    },
+
+    // SASS
+    // All @includes after properties
+    // Nested selectors after properties
+
+    // Variables dash-dashed
+    // This regexp matches:
+    // $button-text-background-color--hover-hola
+    // regex under construction
+    // 'scss/dollar-variable-pattern': '\b[a-z]+(?:-)+(\b[a-z]+(?:-))*',
+
+    // forbid extend
+    'at-rule-blacklist': ['extend'],
+
+    // Nesting depth
+    'max-nesting-depth': 3,
+
+    /* ==========================================================================
+       Best practices
+       ========================================================================== */
+    // Specificity
+    // To learn more about this:
+    // http://csswizardry.com/2014/07/hacks-for-dealing-with-specificity/
+    // "id,class,type",
+    // selector-max-specificity
+    'declaration-no-important': true,
+    'selector-max-compound-selectors': 3,
+    'selector-no-qualifying-type': true,
+
+    // Selectors
+    'no-duplicate-selectors': true,
+
+    // Blocks
+    'block-no-empty': true,
+    'at-rule-empty-line-before': [
+      'always', {
+        // Allow mixins to have an empty line before
+        ignoreAtRules: ['import', 'first-nested'],
+      }],
+    // More styling rules for more consistency
+    'at-rule-name-case': 'lower',
+
+    // Colors
+    'color-hex-case': 'lower',
+    'color-hex-length': 'long',
+    'color-no-invalid-hex': true,
+    'no-indistinguishable-colors': true,
+
+    // strings
+    'string-quotes': 'single',
+
+    // Values
+    // Disallow vendor prefix, they are added by autoprefixer
+    'value-no-vendor-prefix': true,
+    'value-list-comma-space-after': 'always-single-line',
+
+    // Disallows margin: 1px 1px 1px 1px;
+    'shorthand-property-no-redundant-values': true,
+
+    // Comments
+    'comment-whitespace-inside': 'always',
+
+    // Functions
+    'function-comma-space-after': 'always-single-line',
+    'function-comma-space-before': 'never',
+
+    // Numbers
+    // unitless zero and no trailing zeros
+    'length-zero-no-unit': true,
+    'number-no-trailing-zeros': true,
+
+    // Syntax
+    'declaration-block-trailing-semicolon': 'always',
+
+    // Declaration blocks
+    'declaration-block-no-duplicate-properties': true,
+
+    // More on this one here:
+    // http://stylelint.io/user-guide/rules/declaration-block-no-ignored-properties/
+    'declaration-block-no-ignored-properties': true,
+
+    // Require a reason before or after a stylelint disable
+    'stylelint-disable-reason': 'always-after',
+
+    // Prevents adding unnecesary Specificity or complicated sass stuff
+    'scss/selector-no-redundant-nesting-selector': true,
+  },
+};