MNT Replace sass-lint with stylelint (#345)

.stylelintrc.js

@@ -0,0 +1 @@
+module.exports = require('@silverstripe/eslint-config/.stylelintrc');

client/src/components/HistoryViewer/HistoryViewer.scss

@@ -44,7 +44,7 @@ $diff-added-color: #b9f1c8;
   color: $white;
   padding: .4rem .55rem;
 
-  &::before {
+  &:before {
     font-size: 1.4rem;
   }
 }

client/src/components/HistoryViewer/HistoryViewerCompareWarning.scss

@@ -1,5 +1,5 @@
 .history-viewer__compare-notice {
-  border-top: none;
+  border-top: 0;
   border-radius: 0 0 $border-radius $border-radius;
   padding: 0;
   position: absolute;
@@ -17,7 +17,7 @@
     border-width: 0 0 0 $border-width;
     border-color: lighten($color-notice, 10%);
     margin-right: 0;
-    border-radius: 0 0 $border-radius 0;
+    border-radius: 0 0 $border-radius;
 
     &:hover {
       background-color: lighten($color-notice, 10%);

client/src/components/HistoryViewer/HistoryViewerHeading.scss

@@ -4,7 +4,7 @@
 }
 
 .history-viewer__actions-dropdown {
-  .btn[class*=font-icon-]:before {
+  .btn[class*="font-icon-"]:before {
     margin-right: 0;
   }
 

client/src/components/HistoryViewer/HistoryViewerVersionList.scss

@@ -2,6 +2,15 @@
 .history-viewer__table {
   padding: 0;
 
+  &--current {
+    // In detail views, pulls the content (and content tabs) closer to the selected version table
+    margin-bottom: calc($panel-padding-y / 2);
+
+    .history-viewer__version-link:hover {
+      cursor: default;
+    }
+  }
+
   li {
     display: flex;
     list-style-type: none;
@@ -16,7 +25,7 @@
 }
 
 .history-viewer__row--comparison-selected:last-child {
-  border-bottom: none;
+  border-bottom: 0;
 }
 
 .history-viewer__heading,
@@ -47,14 +56,6 @@
       text-decoration: none;
     }
   }
-
-  &__table {
-    &--current {
-      .history-viewer__version-link:hover {
-        cursor: default;
-      }
-    }
-  }
 }
 
 // Give all columns equal width to start with, and table padding
@@ -98,16 +99,9 @@
   }
 }
 
-// In detail views, pulls the content (and content tabs) closer to the selected version table
-.history-viewer__table--current {
-  margin-bottom: calc($panel-padding-y / 2);
-}
-
-.history-viewer {
-  // Ensure that form field styles don't give extra styles to the pagination controls
-  &__pagination {
-    select {
-      width: auto;
-    }
+// Ensure that form field styles don't give extra styles to the pagination controls
+.history-viewer__pagination {
+  select {
+    width: auto;
   }
 }

client/src/styles/legacy/_ArchiveAdmin.scss

@@ -5,7 +5,6 @@
   margin: (-$panel-padding-y) (-$panel-padding-x) 0;
   border-bottom: 1px solid $border-color;
   padding: ($panel-padding-y * 2) ($panel-padding-x * 2);
-
   background-color: $white;
 
   // If there is a message, fix spacing
@@ -15,8 +14,8 @@
     margin-top: 0;
   }
 
-  &::after {
-    border-bottom: none;
+  &:after {
+    border-bottom: 0;
   }
 
   .form__field-label {

package.json

@@ -23,10 +23,10 @@
     "test": "jest",
     "coverage": "jest --coverage",
     "lock": "npm-shrinkwrap --dev",
-    "lint": "eslint client/src && sass-lint client/src",
+    "lint": "yarn lint-js && yarn lint-sass",
     "lint-js": "eslint client/src",
     "lint-js-fix": "eslint client/src --fix",
-    "lint-sass": "sass-lint client/src"
+    "lint-sass": "stylelint client/src"
   },
   "jest": {
     "testEnvironment": "jsdom",
@@ -48,7 +48,7 @@
     }
   },
   "devDependencies": {
-    "@silverstripe/eslint-config": "^1.1.0",
+    "@silverstripe/eslint-config": "^1.3.0",
     "@silverstripe/webpack-config": "^2.0.0",
     "@storybook/addon-actions": "^6.5.13",
     "@storybook/addons": "^6.5.13",