MNT Replace sass-lint with stylelint

.stylelintrc.js

@@ -0,0 +1,99 @@
+module.exports = {
+    'defaultSeverity': 'warning',
+    'extends': [
+        'stylelint-config-recommended-scss',
+        'stylelint-config-sass-guidelines',
+        'stylelint-config-standard',
+    ],
+    'plugins': [
+        'stylelint-scss'
+    ],
+    'rules': {
+        // Line Spacing
+        'rule-empty-line-before': [
+            'always-multi-line',
+            {
+                'ignore': [
+                    'after-comment',
+                    'first-nested',
+                    'inside-block'
+                ]
+            }
+        ],
+        // Selector rules
+        'selector-no-qualifying-type': [
+            true,
+            {
+                'ignore': [
+                    'attribute',
+                    'class'
+                ]
+            }
+        ],
+        'selector-max-id': 2,
+        'selector-max-compound-selectors': 5,
+        'selector-pseudo-element-colon-notation': 'single',
+        'no-descending-specificity': [
+            true,
+            {
+                'ignore': [
+                    'selectors-within-list'
+                ]
+            }
+        ],
+        'max-nesting-depth': [
+            3,
+            {
+                'ignore': [
+                    'blockless-at-rules',
+                    'pseudo-classes'
+                ]
+            }
+        ],
+        // Color rules
+        'color-function-notation': 'legacy',
+        'alpha-value-notation': 'number',
+        'number-max-precision': 5,
+        'color-named': [
+            'never',
+            {
+                'ignore': [
+                    'inside-function'
+                ]
+            }
+        ],
+        // Common rules
+        'function-url-quotes': 'always',
+        'import-notation': 'string',
+        'annotation-no-unknown': [
+            true,
+            {
+                'ignoreAnnotations': [
+                    'default'
+                ]
+            }
+        ],
+
+        'comment-no-empty': true,
+        'declaration-block-no-duplicate-properties': true,
+        'no-irregular-whitespace': true,
+        'block-no-empty': [
+            true,
+            {
+                'ignore': [
+                    'comments'
+                ]
+            }
+        ],
+        'font-family-name-quotes': 'always-unless-keyword',
+        // Turn off rules 
+        'selector-class-pattern': null,
+        'function-no-unknown': null,
+        'property-no-vendor-prefix': null,
+        'value-no-vendor-prefix': null,
+        'font-family-no-missing-generic-family-keyword': null,
+        'scss/dollar-variable-colon-space-after': null,
+        'scss/no-global-function-names': null,
+        'value-keyword-case': null
+    }
+};

package.json

@@ -33,6 +33,12 @@
 		"eslint-plugin-import": "^2.26.0",
 		"eslint-plugin-jsx-a11y": "^6.6.1",
 		"eslint-plugin-react": "^7.31.10",
-		"eslint-webpack-plugin": "^3.2.0"
+		"eslint-webpack-plugin": "^3.2.0",
+		"stylelint": "^16.3.1",
+		"stylelint-config-recommended": "^14.0.0",
+		"stylelint-config-recommended-scss": "^14.0.0",
+		"stylelint-config-sass-guidelines": "^11.1.0",
+		"stylelint-config-standard": "^36.0.0",
+		"stylelint-scss": "^6.2.1"
 	}
 }