[CI] Run stylelint (FreshRSS#2477)

* [CI] Run stylelint

Perform some basic CSS sanity checking and style enforcement.

I removed vendor prefixed linear-gradient and transform because those are from the IE9 era. With IE11 as a minimum and soon obsolete requirement it doesn't make much sense anymore.

* Remove as-link override

* Don't require newline after comment

* Also apply those newline rules to SCSS

* refine opening/closing braces, allow for single-line

.stylelintignore

@@ -0,0 +1,4 @@
+# ignore SASS-generated CSS
+p/themes/Ansum/*.css
+p/themes/Mapco/*.css
+p/themes/Swage/*.css

.stylelintrc

@@ -0,0 +1,74 @@
+{
+  "extends": "stylelint-config-recommended-scss",
+  "plugins": [
+    "stylelint-order",
+    "stylelint-scss"
+  ],
+  "rules": {
+    "at-rule-empty-line-before": [
+      "always", {
+        "ignoreAtRules": [ "after-comment", "else" ]
+      }
+    ],
+    "at-rule-name-space-after": [
+      "always", {
+        "ignoreAtRules": [ "after-comment" ]
+      }
+    ],
+    "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",
+    "color-hex-case": "lower",
+    "color-hex-length": "short",
+    "color-no-invalid-hex": true,
+    "declaration-colon-space-after": "always",
+    "declaration-colon-space-before": "never",
+    "indentation": "tab",
+    "no-descending-specificity": null,
+    "no-eol-whitespace": true,
+    "property-no-vendor-prefix": true,
+    "rule-empty-line-before": [
+      "always",
+      "except": [
+        "after-single-line-comment",
+        "first-nested"
+      ]
+    ],
+    "order/properties-order": [
+      "margin",
+      "padding",
+      "background",
+      "display",
+      "float",
+      "max-width",
+      "width",
+      "max-height",
+      "height",
+      "color",
+      "font",
+      "font-family",
+      "font-size",
+      "border",
+      "border-top",
+      "border-top-color",
+      "border-right",
+      "border-right-color",
+      "border-bottom",
+      "border-bottom-color",
+      "border-left",
+      "border-left-color",
+      "border-radius",
+      "box-shadow"
+    ],
+    "scss/at-else-closing-brace-newline-after": "always-last-in-chain",
+    "scss/at-else-closing-brace-space-after": "always-intermediate",
+    "scss/at-else-empty-line-before": "never",
+    "scss/at-if-closing-brace-newline-after": "always-last-in-chain",
+    "scss/at-if-closing-brace-space-after": "always-intermediate"
+  }
+}

.travis.yml

@@ -48,10 +48,13 @@ matrix:
       env:
         - HADOLINT="$HOME/hadolint"
       install:
-        - npm install jshint
+        - npm install --save-dev jshint stylelint stylelint-order stylelint-scss stylelint-config-recommended-scss
         - curl -sLo "$HADOLINT" $(curl -s https://api.github.com/repos/hadolint/hadolint/releases/latest?access_token="$GITHUB_TOKEN" | jq -r '.assets | .[] | select(.name=="hadolint-Linux-x86_64") | .browser_download_url') && chmod 700 ${HADOLINT}
       script:
         - node_modules/jshint/bin/jshint .
+        # check SCSS separately
+        - stylelint --syntax scss "**/*.scss"
+        - stylelint "**/*.css"
         - bash tests/shellchecks.sh
         - git ls-files --exclude='*Dockerfile*' --ignored | xargs --max-lines=1 "$HADOLINT"
   allow_failures:

docs/assets/css/style.scss

@@ -1,13 +1,10 @@
----
----
-
 @import "{{ site.theme }}";
 
 .page-header .project-name a {
-  color: #fff;
+	color: #fff;
 
-  &:hover {
-    text-decoration: none;
-    opacity: .7;
-  }
+	&:hover {
+		text-decoration: none;
+		opacity: .7;
+	}
 }