feat: added sass support and removed less support

.gitignore

@@ -9,9 +9,11 @@ yarn-error.log*
 yarn.lock
 docs/_babel
 lint.log
+dist/bundles
 docs/static/*.min.css
 !docs/static/docs.min.css
 .storybook/preview-head.html
 .idea
 .storybook-percy
 AssistivTunnel
+.sass-cache

.prettierignore

@@ -13,5 +13,4 @@ package-lock.json
 docs.min.css.*
 lint.log
 docs
-dist
 

.storybook/main.js

@@ -1,12 +1,11 @@
 const path = require("path");
-console.log(`STORYBOOK_DS: ${process.env.STORYBOOK_DS}`);
 module.exports = {
-  stories: ["../src/less/**/*.stories.js", "../src/less/**/stories/**/*.stories.js"],
+  stories: ["../src/sass/**/*.stories.js", "../src/sass/**/stories/**/*.stories.js"],
   webpackFinal: async (config, {
     configType
   }) => {
     config.module.rules.push({
-      test: /\.less/,
+      test: /\.scss/,
       use: ["style-loader", "css-loader", {
         loader: "postcss-loader",
         options: {
@@ -17,14 +16,8 @@ module.exports = {
           }
         }
       }, {
-        loader: "less-loader",
-        options: {
-          lessOptions: {
-            globalVars: {
-              ds: `ds${process.env.STORYBOOK_DS}`
-            }
-          }
-        }
+        loader: "sass-loader",
+        options: {}
       }]
     });
     return config;

.storybook/preview.js

@@ -1 +1 @@
-import "../src/less/bundles/skin-full.less";
+import "../src/sass/bundles/skin-full.scss";

.stylelintrc

@@ -4,17 +4,19 @@
         "stylelint-prettier/recommended"
     ],
     "ignoreFiles": [
-        "dist/mixins/**/*",
+        "dist/**/*",
         "dist/variables/**/*",
         "**/*.min.css",
         "**/*.js",
+        "**/*.less",
         "**/*.svg"
     ],
     "rules": {
         "comment-empty-line-before": null,
         "no-descending-specificity": null,
         "no-duplicate-selectors": null,
         "rule-empty-line-before": null,
+        "no-invalid-double-slash-comments": null,
         "color-function-notation": "legacy",
         "property-no-vendor-prefix": null,
         "selector-no-vendor-prefix": null,
@@ -25,6 +27,8 @@
         "declaration-block-no-redundant-longhand-properties": null,
         "at-rule-empty-line-before": null,
         "media-feature-range-notation": "prefix",
+        "media-query-no-invalid": null,
+        "at-rule-no-unknown": null,
         "value-keyword-case": [
             "lower",
             {
@@ -43,36 +47,24 @@
     "overrides": [
         {
             "files": [
-                "**/*.less"
+                "**/*.scss"
+            ],
+            "extends": [
+                "stylelint-config-standard-scss",
+                "stylelint-config-prettier-scss"
             ],
-            "customSyntax": "postcss-less",
             "plugins": [
-                "stylelint-order",
+                "stylelint-order"
             ],
             "rules": {
-                "at-rule-no-unknown": [
-                    true,
-                    {
-                        "ignoreAtRules": [
-                            "icon-mixin"
-                        ]
-                    }
-                ],
-                "declaration-empty-line-before": null,
-                "function-no-unknown": [
-                    true,
+                "scss/at-mixin-argumentless-call-parentheses": null,
+                "scss/dollar-variable-pattern": null,
+                "value-keyword-case": [
+                    "lower",
                     {
-                        "ignoreFunctions": [
-                            "fade",
-                            "shade",
-                            "tint"
-                        ]
+                        "camelCaseSvgKeywords": true
                     }
                 ],
-                "media-query-no-invalid": null,
-                "no-descending-specificity": true,
-                "no-duplicate-selectors": true,
-                "order/properties-alphabetical-order": true
             }
         }
     ]

CONTRIBUTING.md

@@ -399,7 +399,7 @@ Once Jekyll is setup successfully, running a build should create the following f
 -   `./_site/static/common/docs.min.js`
     -   this is the Babel & Webpack output of `./docs/src/js/main.js`
 -   `./_site/static/dsx/docs.min.css`
-    -   this is the LESS compiler output of `./docs/src/less/dsx.less`
+    -   this is the SASS compiler output of `./docs/src/sass/dsx.less`
 -   `./_site/static/dsx/skin.min.css`
     -   the full, minified skin css bundle (only used in development environment)
 -   `./_site/index.html`