Add (S)CSS linting

.github/workflows/javascript_tests.yml

@@ -23,6 +23,7 @@ jobs:
       - name: Linting
         run: |
           npm run lint
+          npm run stylelint
       - name: Testing
         run: npm run test
 ...

.stylelintrc

@@ -0,0 +1,5 @@
+{
+  "extends": [
+    "stylelint-config-standard",
+  ],
+}

package.json

@@ -21,11 +21,15 @@
     "prettier": "^1.19.1",
     "react-redux-test-utils": "^0.1.1",
     "sortabular": "^1.5.1",
+    "stylelint": "^9.3.0",
+    "stylelint-config-standard": "^18.0.0",
     "table-resolver": "^3.2.0"
   },
   "scripts": {
     "lint": "tfm-lint --plugin -d *.js,webpack",
     "lint-fix": "tfm-lint --plugin -d *.js,webpack --fix",
+    "stylelint": "stylelint webpack/**/*.scss",
+    "stylelint-fix": "stylelint webpack/**/*.scss --fix",
     "test": "jest --no-cache"
   },
   "repository": {

webpack/components/ApplicationInstanceReport/ApplicationInstanceReport.scss

@@ -5,26 +5,26 @@
 }
 
 .deploy_status_head {
-  float:left;
-  width:25%;
-  height:10%;
+  float: left;
+  width: 25%;
+  height: 10%;
 }
 
 .deploy_status_content {
-  float:left;
-  width:75%;
-  height:10%;
+  float: left;
+  width: 75%;
+  height: 10%;
 }
 
 .deploy_report_hosts {
-  float:left;
-  width:25%;
-  height:100%;
+  float: left;
+  width: 25%;
+  height: 100%;
 }
 
 .deploy_report_tasks {
-  float:left;
-  width:75%;
+  float: left;
+  width: 75%;
   min-height: 300px;
   background-color: #ecf9fe;
   padding: 10px;

webpack/components/ExistingHostSelection/ExistingHostSelection.scss

@@ -1,11 +1,11 @@
 @import '~@theforeman/vendor/scss/variables';
 
 .add_existing_hosts_modal {
-    margin-top: 0;
-    margin-bottom: 0;
-    height: 100%;
-    width: 80%;
-    max-width: none !important;
+  margin-top: 0;
+  margin-bottom: 0;
+  height: 100%;
+  width: 80%;
+  max-width: none !important;
 }
 
 .row {

webpack/components/ParameterSelection/ParameterSelection.scss

@@ -1,17 +1,17 @@
 @import '~@theforeman/vendor/scss/variables';
 
 .param_selection_modal {
-    margin-top: 0;
-    margin-bottom: 0;
-    height: 100%;
-    width: 80%;
-    max-width: none !important;
+  margin-top: 0;
+  margin-bottom: 0;
+  height: 100%;
+  width: 80%;
+  max-width: none !important;
 }
 
 .complex_data_modal {
-    margin-top: 0;
-    margin-bottom: 0;
-    height: 80%;
-    width: 40%;
-    max-width: none !important;
+  margin-top: 0;
+  margin-bottom: 0;
+  height: 80%;
+  width: 40%;
+  max-width: none !important;
 }