Fix hints by lint:scss and stylelint

.editorconfig

@@ -0,0 +1,12 @@
+# EditorConfig is awesome: https://EditorConfig.org
+
+# top-most EditorConfig file
+root = true
+
+[*]
+indent_style = space
+indent_size = 4
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true

.github/workflows/build-test.yml

@@ -34,12 +34,18 @@ jobs:
       - name: Install npm packages
         run: npm ci
 
+      - name: Lint SCSS
+        run: npm run lint:scss
+
       - name: Build CSS
-        run: npm run compile:build
+        run: npm run compile:css
 
       - name: Build CSS-RTL
         run: npm run compile:rtl
 
+      - name: Lint JS
+        run: npm run lint:js
+
       - name: Build JS
         run: npm run build
 

.stylelintrc.json

@@ -13,6 +13,8 @@
         "no-duplicate-selectors": null,
         "font-family-no-duplicate-names": null,
         "selector-class-pattern": null,
-        "function-url-quotes": null
+        "function-url-quotes": null,
+        "declaration-property-unit-allowed-list":  null,
+        "scss/no-global-function-names": null
     }
 }

sass/_accordion.scss

@@ -1,18 +1,20 @@
-.c-accordion{
-    &__title{
+.c-accordion {
+
+    &__title {
 
         font-size: 25px;
         font-family: PTSans !important;
 
-        &:before{
+        &::before {
             display: none !important;
         }
-        &:after{
+
+        &::after {
+
             content: ">";
             padding-left: 1em;
-            font-weight: bold;
-            position:relative;
+            font-weight: 700;
+            position: relative;
         }
     }
 }
-

sass/_archives.scss

@@ -1,20 +1,24 @@
-.archive{
-    a{
+.archive {
+
+    a {
         text-decoration: none;
     }
-    article{
+
+    article {
         border-radius: $border-radius;
         overflow: hidden;
     }
 
-    .page-header{
+    .page-header {
         padding-top: 80px;
         padding-bottom: 80px;
     }
 
-    &-loop{
-        .entry-content{
-            a{
+    &-loop {
+
+        .entry-content {
+
+            a {
                 color: $body-color;
             }
         }

sass/_colors.scss

@@ -1,9 +1,8 @@
-
-.bg-lightgreen{
+.bg-lightgreen {
     background-color: $lightgreen;
 }
 
-.bg-darkgreen{
+.bg-darkgreen {
     background-color: $darkgreen;
 }
 
@@ -20,4 +19,4 @@
     .has-#{$name}-hover-background-color:hover {
         background-color: $code !important;
     }
-  }
+}

sass/_comments.scss

@@ -1,134 +1,140 @@
-.comment{
-    &-list{
-       list-style-type: none;
+.comment {
+
+    &-list {
+        list-style-type: none;
     }
 
-    &s-title{
+    &s-title {
         text-align: center;
         margin: 50px 0;
     }
 
-    .children{
+    .children {
         border-left: 2px solid $primary;
         margin-bottom: 65px;
         margin-left: 0;
+
         @include media-breakpoint-up(md) {
             margin-left: 1.5em;
         }
 
     }
 
-    &-body{
-        footer{
+    &-body {
+
+        footer {
             display: block;
+
             @include media-breakpoint-up(md) {
                 display: flex;
             }
 
-            .says{
+            .says {
                 display: none;
             }
 
-            .comment{
-                &-author{
+            .comment {
+
+                &-author {
+
                     @include media-breakpoint-up(md) {
                         border-right: 1px solid $black;
                         padding-right: 10px;
                         margin-right: 10px;
                     }
                 }
-                &-metadata{
+
+                &-metadata {
                     margin-bottom: 10px;
+
                     @include media-breakpoint-up(md) {
                         margin-bottom: 0;
                     }
-                    a{
-                        color:inherit;
+
+                    a {
+                        color: inherit;
                         text-decoration: none;
                     }
                 }
             }
         }
 
-        .reply{
+        .reply {
             text-align: right;
         }
-        .comment-reply-link{
+
+        .comment-reply-link {
             font-style: italic;
             text-transform: uppercase;
             color: $black;
             text-decoration: none;
-            font-weight: bold;
+            font-weight: 700;
         }
     }
 
-    &-reply{
-        &-title{
+    &-reply {
+
+        &-title {
             text-align: center;
         }
     }
 
 
-    &-respond{
+    &-respond {
+
         background-color: $white;
         padding: 30px;
         border-radius: $border-radius;
 
 
-        label{
+        label {
             display: block;
         }
 
-        .comment-form-cookies-consent{
+        .comment-form-cookies-consent {
             display: flex;
             align-items: center;
 
-            input{
+            input {
                 width: 50px;
                 height: 50px;
                 margin-right: 1em;
             }
-            label{
+
+            label {
                 display: inline;
                 font-size: 15px;
             }
         }
 
-        input[type=url],
-        input[type=text],
-        input[type=email]{
+        input[type="url"],
+        input[type="text"],
+        input[type="email"] {
             width: 100%;
         }
     }
 
-    &-form{
-       &-comment{
+    &-form {
 
-       }
+        &-comment {}
 
-       &-author,
-       &-email,
-       &-url{
+        &-author,
+        &-email,
+        &-url {}
 
-       }
+        &-meta {}
 
-       &-meta{
+        &-cookies-consent {
 
-       }
-
-       &-cookies-consent{
-
-           label{
-
-           }
-       }
+            label {}
+        }
     }
 }
 
-.form-submit{
+.form-submit {
     text-align: right;
 
-    input{
+    input {
         background-color: #46962b;
         text-transform: uppercase;
         font-size: 1rem;
@@ -140,6 +146,6 @@
     }
 }
 
-.comments-area{
+.comments-area {
     min-height: 100px;
 }