Adding task to build and watch sass.

.vscode/tasks.json

@@ -0,0 +1,24 @@
+// Sass configuration
+{
+    // See https://go.microsoft.com/fwlink/?LinkId=733558
+    // for the documentation about the tasks.json format
+    "version": "2.0.0",
+    "tasks": 
+    [
+        {
+            "label": "Compile SASS",
+            "type": "shell",
+            "command": "gulp sass",
+            "group": "build",
+            "problemMatcher": [
+                "$node-sass"
+            ]
+        },
+        {
+            "label": "Watch SASS",
+            "type": "shell",
+            "command": "gulp watch",
+            "group": "build"
+        }
+    ]
+}

gulpfile.js

@@ -0,0 +1,20 @@
+var gulp = require('gulp');
+var sass = require('gulp-sass');
+
+gulp.task("sass", function (cb)
+{
+    gulp.src("./src/scss/custom.scss")
+        .pipe(sass())
+        .pipe(gulp.dest(function (f)
+        {
+            return "./dist/css/";
+        }));
+    cb();
+});
+
+gulp.task("watch", gulp.series("sass", function (cb)
+{
+    gulp.watch("./src/scss/custom.scss", gulp.series("sass"));
+    gulp.watch("./src/scss/fragments/*.scss", gulp.series("sass"));
+    cb();
+}));

package.json

@@ -7,6 +7,8 @@
     "@types/jquery": "^3.3.29",
     "bootstrap": "^4.3.1",
     "electron": "^4.0.5",
+    "gulp": "^4.0.0",
+    "gulp-sass": "^4.0.2",
     "jquery": "^3.3.1",
     "npm": "^6.9.0",
     "oidc-client": "^1.6.1",

src/scss/fragments/carousel.scss

@@ -15,7 +15,7 @@
   position: absolute;
   transform: translateZ(-880px) rotateY(0);
   transform-style: preserve-3d;
-  transition: transform 1s;
+  transition: transform 1s; 
 }
 
 .carousel__cell