Switch to maintained stylelint

.sass-lint.yml

@@ -1,2 +0,0 @@
-rules:
-# No global rules currently

.stylelintrc

@@ -0,0 +1,10 @@
+{
+  "extends": "stylelint-config-standard",
+  "rules": {
+    "at-rule-no-unknown": [true, {
+      "ignoreAtRules": ["function", "if", "each", "include", "mixin"]
+    }],
+    "number-leading-zero": "never",
+    "no-descending-specificity": null
+  }
+}

assets/icons/icon.scss

@@ -7,9 +7,10 @@ $cache-breaker: unique-id();
   font-family: 'ionicons';
   font-style: normal;
   font-weight: normal;
-  src: url('fonts/meshviewer.woff2?rel=#{$cache-breaker}') format('woff2'),
-  url('fonts/meshviewer.woff?rel=#{$cache-breaker}') format('woff'),
-  url('fonts/meshviewer.ttf?rel=#{$cache-breaker}') format('truetype');
+  src:
+    url('fonts/meshviewer.woff2?rel=#{$cache-breaker}') format('woff2'),
+    url('fonts/meshviewer.woff?rel=#{$cache-breaker}') format('woff'),
+    url('fonts/meshviewer.ttf?rel=#{$cache-breaker}') format('truetype');
 }
 
 [class^='ion-'],

gulp/tasks/sasslint.js

@@ -1,8 +1,12 @@
 module.exports = function (gulp, plugins, config, env) {
   return function sasslint() {
     return gulp.src('scss/**/*.scss')
-      .pipe(plugins.sassLint())
-      .pipe(plugins.sassLint.format())
-      .pipe(env.production(plugins.sassLint.failOnError()));
+      .pipe(plugins.stylelint({
+        syntax: 'scss',
+        failAfterError: env.production(),
+        reporters: [
+          { formatter: 'string', console: true }
+        ]
+      }));
   };
 };

package.json

@@ -31,9 +31,11 @@
     "gulp-real-favicon": "^0.3.2",
     "gulp-requirejs-optimize": "^1.3.0",
     "gulp-sass": "^4.0.2",
-    "gulp-sass-lint": "^1.4.0",
     "gulp-sourcemaps": "^2.6.5",
-    "gulp-uglify": "^3.0.2"
+    "gulp-stylelint": "^13.0.0",
+    "gulp-uglify": "^3.0.2",
+    "stylelint": "^13.3.2",
+    "stylelint-config-standard": "^20.0.0"
   },
   "eslintConfig": {
     "env": {

scss/mixins/_font.scss

@@ -4,14 +4,16 @@ $font-path: 'fonts' !default;
   @if $alias == '' {
     $alias: $name;
   }
+
   @font-face {
     font-family: '#{$alias}';
     font-style: $style;
     font-weight: $weight;
-    src: local('#{$name} #{$type}'),
-    local('#{$name}-#{$type}'),
-    url('#{$font-path}/#{$name}-#{$type}.woff2') format('woff2'),
-    url('#{$font-path}/#{$name}-#{$type}.woff') format('woff'),
-    url('#{$font-path}/#{$name}-#{$type}.ttf') format('truetype');
+    src:
+      local('#{$name} #{$type}'),
+      local('#{$name}-#{$type}'),
+      url('#{$font-path}/#{$name}-#{$type}.woff2') format('woff2'),
+      url('#{$font-path}/#{$name}-#{$type}.woff') format('woff'),
+      url('#{$font-path}/#{$name}-#{$type}.ttf') format('truetype');
   }
 }

scss/modules/_base.scss

@@ -1,5 +1,5 @@
 body {
-  -webkit-tap-highlight-color: transparent; // sass-lint:disable-line no-vendor-prefixes
+  -webkit-tap-highlight-color: transparent;
   background: $color-white;
   color: $color-black;
   font-family: $font-family;
@@ -75,7 +75,7 @@ strong {
 }
 
 .hide {
-  display: none !important; // sass-lint:disable-line no-important
+  display: none !important;
 }
 
 .sr-only {

scss/modules/_button.scss

@@ -41,7 +41,7 @@ button {
   // Tooltip
   &[data-tooltip] {
     &::after {
-      background:  $color-black;
+      background: $color-black;
       border-radius: 3px;
       color: $color-white;
       content: attr(data-tooltip);
@@ -76,7 +76,6 @@ button {
 }
 
 // Tooltip
-// sass-lint:disable-block nesting-depth
 .content,
 .sidebar > {
   button {

scss/modules/_leaflet.scss

@@ -50,15 +50,15 @@
   }
 
   &.leaflet-touch-zoom {
-    -ms-touch-action: pan-x pan-y; // sass-lint:disable-line no-vendor-prefixes
+    -ms-touch-action: pan-x pan-y;
     touch-action: pan-x pan-y;
   }
 
   &.leaflet-touch-drag {
-    -ms-touch-action: pinch-zoom; // sass-lint:disable-line no-vendor-prefixes
+    -ms-touch-action: pinch-zoom;
 
     &.leaflet-touch-drag {
-      -ms-touch-action: none; // sass-lint:disable-line no-vendor-prefixes
+      -ms-touch-action: none;
       touch-action: none;
     }
   }
@@ -84,7 +84,7 @@
 
     &::before {
       content: '\f229';
-      font-family: ionicons;
+      font-family: $font-family-icons;
       speak: none;
       text-rendering: auto;
     }
@@ -113,12 +113,12 @@
 ///* Safari renders non-retina tile on retina better with this, but Chrome is worse */
 .leaflet-safari {
   .leaflet-tile {
-    image-rendering: -webkit-optimize-contrast; // sass-lint:disable-line no-vendor-prefixes
+    image-rendering: -webkit-optimize-contrast;
   }
 
   ///* hack that prevents hw layers "stretching" when loading new tiles */
   .leaflet-tile-container {
-    -webkit-transform-origin: 0 0; // sass-lint:disable-line no-vendor-prefixes
+    -webkit-transform-origin: 0 0;
     height: 1600px;
     width: 1600px;
   }
@@ -139,7 +139,7 @@
 }
 
 .leaflet-zoom-box {
-  -moz-box-sizing: border-box; // sass-lint:disable-line no-vendor-prefixes
+  -moz-box-sizing: border-box;
   box-sizing: border-box;
   height: 0;
   width: 0;
@@ -151,7 +151,7 @@
   z-index: 400;
 
   svg {
-    -moz-user-select: none; // sass-lint:disable-line no-vendor-prefixes
+    -moz-user-select: none;
   }
 }
 
@@ -232,7 +232,6 @@
 
 .leaflet-bottom {
   bottom: 0;
-
 }
 
 .leaflet-left {
@@ -273,7 +272,6 @@
   .leaflet-zoom-hide {
     visibility: hidden;
   }
-
 }
 
 .leaflet-zoom-anim,
@@ -288,8 +286,8 @@
 }
 
 .leaflet-grab {
-  cursor: -webkit-grab; // sass-lint:disable-line no-vendor-prefixes
-  cursor: -moz-grab; // sass-lint:disable-line no-vendor-prefixes no-duplicate-properties
+  cursor: -webkit-grab;
+  cursor: -moz-grab;
 }
 
 .leaflet-crosshair {
@@ -310,8 +308,8 @@
     &,
     &.leaflet-interactive {
       cursor: move;
-      cursor: -webkit-grabbing; // sass-lint:disable-line no-vendor-prefixes no-duplicate-properties
-      cursor: -moz-grabbing; // sass-lint:disable-line no-vendor-prefixes no-duplicate-properties
+      cursor: -webkit-grabbing;
+      cursor: -moz-grabbing;
     }
   }
 }
@@ -364,7 +362,6 @@
   padding-right: 5px;
 }
 
-
 .leaflet-control-layers-selector {
   display: none;
 

scss/modules/_reset.scss

@@ -1,6 +1,6 @@
 // Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
 // http://cssreset.com
-// sass-lint:disable-all
+/* stylelint-disable */
 html, body, div, span, applet, object, iframe,
 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
 a, abbr, acronym, address, big, cite, code,

scss/modules/_sidebar.scss

@@ -13,13 +13,13 @@
       left: $button-distance;
       transform: scale(-1, 1);
 
-      // sass-lint:disable-block nesting-depth
       &[aria-label] {
         &::after {
-          transform: scale(-1, 1) translate(105px, 52px) !important; // sass-lint:disable-line no-important
+          transform: scale(-1, 1) translate(105px, 52px) !important;
         }
       }
     }
+
     @media screen and (max-width: map-get($grid-breakpoints, lg) - 1) {
       width: auto;
     }
@@ -128,7 +128,7 @@
 
   &[aria-label] {
     &::after {
-      transform: translate(-45px, 52px) !important; // sass-lint:disable-line no-important
+      transform: translate(-45px, 52px) !important;
     }
   }
 }

scss/modules/_tabs.scss

@@ -3,13 +3,13 @@
   border: 0 solid darken($color-white, 10%);
   border-bottom-width: 1px;
   display: flex;
-  display: -webkit-flex; // sass-lint:disable-line no-vendor-prefixes no-duplicate-properties
+  display: -webkit-flex;
   list-style: none;
   margin: 0;
   padding: 0;
 
   li {
-    -webkit-flex: 1 1 auto; // sass-lint:disable-line no-vendor-prefixes
+    -webkit-flex: 1 1 auto;
     color: transparentize($color-black, .5);
     cursor: pointer;
     flex: 1 1 auto;

scss/modules/_variables.scss

@@ -16,7 +16,7 @@ $color-others: #0a9c92 !default;
 
 $color-map-background: #f8f4f0 !default;
 
-$font-family: Assistant, sans-serif !default;
+$font-family: "Assistant", sans-serif !default;
 $font-family-icons: ionicons !default;
 $font-family-monospace: monospace !default;
 $font-size: 15px !default;