Update stylelint dependencies (#9483)

* chore: update stylelint

* css fixes

* css fixes

* css fixes

.husky/pre-commit

@@ -1,4 +1,4 @@
 #!/bin/sh
 . "$(dirname "$0")/_/husky.sh"
 
-npx lint-staged
+lint-staged

.stylelintrc.json

@@ -1,26 +1,17 @@
 {
   "extends": ["stylelint-config-standard-scss"],
   "rules": {
-    "indentation": 4,
     "color-function-notation": "legacy",
     "alpha-value-notation": "number",
-    "color-hex-case": "lower",
     "color-no-invalid-hex": true,
     "function-calc-no-unspaced-operator": true,
-    "function-comma-space-after": "always-single-line",
-    "function-comma-space-before": "never",
     "function-name-case": "lower",
     "function-url-quotes": "always",
     "function-url-scheme-disallowed-list": [
       "data"
     ],
-    "function-whitespace-after": "always",
-    "number-leading-zero": "always",
-    "number-no-trailing-zeros": true,
     "length-zero-no-unit": true,
     "string-no-newline": true,
-    "string-quotes": "single",
-    "unit-case": "lower",
     "unit-no-unknown": true,
     "unit-allowed-list": [
       "px",
@@ -34,11 +25,8 @@
       "s",
       "rem"
     ],
-    "value-list-comma-space-after": "always-single-line",
-    "value-list-comma-space-before": "never",
     "shorthand-property-no-redundant-values": true,
     "declaration-no-important": true,
-    "property-case": "lower",
     "no-duplicate-at-import-rules": true,
     "declaration-block-no-duplicate-properties": [
       true,
@@ -48,12 +36,7 @@
         ]
       }
     ],
-    "declaration-block-trailing-semicolon": "always",
     "declaration-block-single-line-max-declarations": 1,
-    "declaration-block-semicolon-space-before": "never",
-    "declaration-block-semicolon-space-after": "always-single-line",
-    "declaration-block-semicolon-newline-before": "never-multi-line",
-    "declaration-block-semicolon-newline-after": "always-multi-line",
     "declaration-property-value-disallowed-list": [
       {
         "/.*/": [
@@ -64,33 +47,12 @@
         "message": "The `initial` value is not supported in IE."
       }
     ],
-    "block-closing-brace-newline-after": [
-      "always",
-      {
-        "ignoreAtRules": ["if", "else"]
-      }
-    ],
-    "block-closing-brace-newline-before": "always-multi-line",
-    "block-opening-brace-newline-after": "always-multi-line",
-    "block-opening-brace-space-before": "always-multi-line",
-    "selector-attribute-brackets-space-inside": "never",
-    "selector-attribute-operator-space-after": "never",
-    "selector-attribute-operator-space-before": "never",
-    "selector-combinator-space-after": "always",
-    "selector-combinator-space-before": "always",
-    "selector-pseudo-class-case": "lower",
-    "selector-pseudo-class-parentheses-space-inside": "never",
-    "selector-pseudo-element-case": "lower",
     "selector-pseudo-element-colon-notation": "double",
     "selector-pseudo-element-no-unknown": [true, {
       "ignorePseudoElements": ["ng-deep"]
     }],
     "selector-type-case": "lower",
     "selector-max-id": 0,
-    "no-missing-end-of-source-newline": true,
-    "no-eol-whitespace": true,
-    "max-line-length": 240,
-    "linebreaks": "unix",
     "selector-class-pattern": [
       "^_?(adf|adf-|app|app-|example-|demo-|textLayer|canvasWrapper|page)",
       {

.vscode/settings.json

@@ -22,9 +22,9 @@
   "css.validate": false,
   "scss.validate": false,
   "stylelint.config": {
-      "extends": "./stylelint-config"
+      "extends": "./.stylelintrc.json"
   },
-  "stylelint.configFile": "stylelint-config.json",
+  "stylelint.configFile": ".stylelintrc.json",
   "stylelint.validate": [
     "css",
     "less",

angular.json

@@ -427,7 +427,7 @@
               "options": {
               "commands": [
                   {
-                      "command": "npx stylelint lib/core/**/*.scss --config stylelint-config.json"
+                      "command": "npx stylelint lib/core/**/*.scss --config .stylelintrc.json"
                   }
               ]
           }
@@ -573,7 +573,7 @@
               "options": {
               "commands": [
                   {
-                      "command": "npx stylelint lib/content-services/**/*.scss --config stylelint-config.json"
+                      "command": "npx stylelint lib/content-services/**/*.scss --config .stylelintrc.json"
                   }
               ]
           }
@@ -644,7 +644,7 @@
               "options": {
               "commands": [
                   {
-                      "command": "npx stylelint lib/process-services-cloud/**/*.scss --config stylelint-config.json"
+                      "command": "npx stylelint lib/process-services-cloud/**/*.scss --config .stylelintrc.json"
                   }
               ]
           }
@@ -776,7 +776,7 @@
               "options": {
               "commands": [
                   {
-                      "command": "npx stylelint lib/process-services-cloud/**/*.scss --config stylelint-config.json"
+                      "command": "npx stylelint lib/process-services-cloud/**/*.scss --config .stylelintrc.json"
                   }
               ]
           }
@@ -847,7 +847,7 @@
               "options": {
               "commands": [
                   {
-                      "command": "npx stylelint lib/insights/**/*.scss --config stylelint-config.json"
+                      "command": "npx stylelint lib/insights/**/*.scss --config .stylelintrc.json"
                   }
               ]
           }

lib/content-services/src/lib/content-node-selector/content-node-selector.component.scss

@@ -81,7 +81,7 @@ adf-content-node-selector {
     }
 }
 
-@media screen and (max-width: 768px) {
+@media screen and (width <= 768px) {
     .adf-content-node-selector-dialog {
         height: 100vh;
     }

lib/content-services/src/lib/content-user-info/content-user-info.component.scss

@@ -140,7 +140,7 @@
     }
 }
 
-@media only screen and (min-device-width: 480px) {
+@media only screen and (device-width >= 480px) {
     .adf-content-userinfo-menu.adf-userinfo-menu {
         max-height: 450px;
         min-width: 450px;

lib/content-services/src/lib/dialogs/folder.dialog.scss

@@ -18,7 +18,7 @@
     color: var(--adf-theme-foreground-text-color-054);
 }
 
-@media screen and (max-width: 380px) {
+@media screen and (width <= 380px) {
     .adf-folder-dialog-title {
         margin: 0;
     }

lib/content-services/src/lib/new-version-uploader/new-version-uploader.dialog.scss

@@ -39,7 +39,6 @@
     &-content {
         flex: 1 1 auto;
         position: relative;
-        overflow-y: auto;
         max-height: 100vh;
         overflow: hidden;
         padding: 2px 26px;

lib/content-services/src/lib/upload/components/file-uploading-dialog.component.scss

@@ -80,10 +80,15 @@
     }
 }
 
-[adfUploadDialogLeft] .adf-upload-dialog { left: 25px; }
+[adfUploadDialogLeft] .adf-upload-dialog {
-[adfUploadDialogRight] .adf-upload-dialog { right: 25px; }
+    left: 25px;
+}
 
-@media screen and (min-width: 380px) and (max-width: 768px) {
+[adfUploadDialogRight] .adf-upload-dialog {
+    right: 25px;
+}
+
+@media screen and (width >= 380px) and (width <= 768px) {
     .adf-upload-dialog {
         width: 60%;
     }
@@ -93,7 +98,7 @@
     }
 }
 
-@media screen and (max-width: 380px) {
+@media screen and (width <= 380px) {
     .adf-upload-dialog {
         width: 85%;
     }

lib/content-services/src/lib/version-manager/version-comparison.component.scss

@@ -1,7 +1,6 @@
 .adf-version-comparison-content {
     display: flex;
     align-items: center;
-    align-content: center;
     justify-content: space-around;
 }
 

lib/content-services/src/lib/version-manager/version-list.component.scss

@@ -21,7 +21,7 @@
         width: 500px;
         opacity: 0.5;
 
-        @media screen and (max-width: 629px) {
+        @media screen and (width <= 629px) {
             width: 97%;
         }
     }

lib/process-services-cloud/src/lib/form/components/form-cloud.component.scss

@@ -76,8 +76,7 @@
 
             mat-card-content {
                 height: 100%;
-                overflow-x: hidden;
+                overflow: hidden auto;
-                overflow-y: auto;
             }
 
             mat-card-actions {

package.json

@@ -190,8 +190,8 @@
     "shelljs": "^0.8.5",
     "shx": "^0.3.4",
     "spdx-license-list": "^6.8.0",
-    "stylelint": "^14.15.0",
+    "stylelint": "^16.3.1",
-    "stylelint-config-standard-scss": "^3.0.0",
+    "stylelint-config-standard-scss": "^13.0.0",
     "ts-node": "^10.9.1",
     "tsconfig-paths": "^4.1.1",
     "typescript": "4.7.4",