switch from sass to less (css) (#167)

.gitignore

@@ -2,6 +2,7 @@
 .DS_Store
 .cache
 .idea
+.vscode
 .node_repl_history
 .npm
 build/Release
@@ -17,4 +18,4 @@ npm-debug.log*
 package-lock.json
 repl-temp-*
 result
-src-url
+src-url

default.nix

@@ -20,22 +20,6 @@ let
       echo 9 > $HOME/.node-gyp/${pkgs.nodejs.version}/installVersion
       ln -sfv ${pkgs.nodejs}/include $HOME/.node-gyp/${pkgs.nodejs.version}
     '';
-    pkgConfig = {
-      node-sass = {
-        buildInputs = with pkgs; [
-          which
-          python2
-          libsass
-          pkgconfig
-        ] ++ pkgs.lib.optionals pkgs.stdenv.isDarwin [
-          xcodebuild
-        ];
-        postInstall = ''
-          LIBSASS_EXT=auto yarn --offline run build
-          rm build/config.gypi
-        '';
-      };
-    };
     publishBinsFor =
       [
         "webpack"

package.json

@@ -28,10 +28,10 @@
     "file-loader": "^6.0.0",
     "google-closure-compiler": "^20200224.0.0",
     "html-webpack-plugin": "^4.0.2",
+    "less": "^3.12.2",
+    "less-loader": "^7.0.0",
     "mini-css-extract-plugin": "^0.9.0",
-    "node-sass": "^4.13.1",
     "resolve-url-loader": "^3.1.0",
-    "sass-loader": "^8.0.0",
     "style-loader": "^1.0.0",
     "url-loader": "^4.0.0",
     "webpack": "^4.41.2",
@@ -42,4 +42,4 @@
   "dependencies": {
     "purecss": "^1.0.1"
   }
-}
+}

src/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-require("./index.scss");
+require("./index.less");
 
 const {Elm} = require('./Main');
 
@@ -11,4 +11,4 @@ Elm.Main.init({
     elasticsearchUsername : process.env.ELASTICSEARCH_USERNAME || 'z3ZFJ6y2mR',
     elasticsearchPassword : process.env.ELASTICSEARCH_PASSWORD || 'ds8CEvALPf9pui7XG'
   }
-});
+});

src/index.less

@@ -89,7 +89,6 @@ header .navbar.navbar-static-top {
   }
 }
 
-
 .loader,
 .loader:before,
 .loader:after {
@@ -149,4 +148,3 @@ header .navbar.navbar-static-top {
     height: 5em;
   }
 }
-

webpack.config.js

@@ -50,10 +50,10 @@ var common = {
                 }
             },
             {
-                test: /\.scss$/,
+                test: /\.less$/,
                 exclude: [/elm-stuff/, /node_modules/],
                 // see https://github.com/webpack-contrib/css-loader#url
-                loaders: ["style-loader", "css-loader?url=false", "sass-loader"]
+                loaders: ["style-loader", "css-loader?url=false", "less-loader"]
             },
             {
                 test: /\.css$/,
@@ -174,12 +174,12 @@ if (MODE === "production") {
                     ]
                 },
                 {
-                    test: /\.scss$/,
+                    test: /\.less$/,
                     exclude: [/elm-stuff/, /node_modules/],
                     loaders: [
                         MiniCssExtractPlugin.loader,
                         "css-loader?url=false",
-                        "sass-loader"
+                        "less-loader"
                     ]
                 }
             ]