fix: various stylelint fixes based on `stylelint ./resources/scss/**/…

…*.scss --fix`

resources/scss/components/_external-icon.scss

@@ -1,7 +1,7 @@
 .external-icon {
     content: '(external link)';
     display: inline-block;
-    background-color: currentColor;
+    background-color: currentcolor;
     mask-image: url('/_resources/images/external-link.svg');
     mask-repeat: no-repeat;
     mask-position: center;

resources/scss/components/_flickity.scss

@@ -7,7 +7,7 @@ button.flickity-button.flickity-prev-next-button.next::after {
     background: transparent;
     transform-origin: 0, 0;
     z-index: -1;
-    background-color: rgba(5, 33, 30, 0.4);
+    background-color: rgb(5 33 30 / 40%);
 }
 
 button.flickity-button.flickity-prev-next-button.next::after {
@@ -16,7 +16,7 @@ button.flickity-button.flickity-prev-next-button.next::after {
     height: 1.14em;
     top: 1.19em;
     right: 0.51em;
-    box-shadow: 0 1px 1px rgba(5, 33, 30, 0.4);
+    box-shadow: 0 1px 1px rgb(5 33 30 / 40%);
 }
 
 button.flickity-button.flickity-prev-next-button.next::before {
@@ -25,7 +25,7 @@ button.flickity-button.flickity-prev-next-button.next::before {
     height: 1em;
     top: 0.6em;
     right: 0.54em;
-    box-shadow: 0 1px 1px rgba(5, 33, 30, 0.4);
+    box-shadow: 0 1px 1px rgb(5 33 30 / 40%);
 }
 
 button.flickity-button.flickity-prev-next-button.previous::after {
@@ -34,7 +34,7 @@ button.flickity-button.flickity-prev-next-button.previous::after {
     height: 1.14em;
     top: 1.19em;
     left: 0.51em;
-    box-shadow: 0 1px 1px rgba(5, 33, 30, 0.4);
+    box-shadow: 0 1px 1px rgb(5 33 30 / 40%);
 }
 
 button.flickity-button.flickity-prev-next-button.previous::before {
@@ -43,7 +43,7 @@ button.flickity-button.flickity-prev-next-button.previous::before {
     height: 1em;
     top: 0.6em;
     left: 0.54em;
-    box-shadow: 0 1px 1px rgba(5, 33, 30, 0.4);
+    box-shadow: 0 1px 1px rgb(5 33 30 / 40%);
 }
 
 .flickity-enabled:focus .flickity-viewport {

resources/scss/components/_formy.scss

@@ -39,7 +39,7 @@
         @apply border-gray-400 border-solid border block w-full p-2 text-base m-0 mb-4 font-normal h-10 rounded-none;
 
         box-sizing: border-box;
-        box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
+        box-shadow: inset 0 1px 2px rgb(10 10 10 / 10%);
         transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
         appearance: none;
     }
@@ -129,8 +129,8 @@
         @apply float-none inline ml-2;
     }
 
-    div.checkbox input[type=checkbox],
-    div.radio input[type=radio] {
+    div.checkbox input[type="checkbox"],
+    div.radio input[type="radio"] {
         @apply mb-0;
     }
 

resources/scss/components/_full-width-styleguide-hero.scss

@@ -13,7 +13,7 @@
         .button {
             @apply xl:py-4;
 
-            @media only screen and (max-width: 576px) {
+            @media only screen and (width <= 576px) {
                 @apply bg-green text-white hover:bg-green-700 focus:bg-green-700;
             }
         }

resources/scss/components/_global.scss

@@ -1,7 +1,7 @@
 // Restricts the embedded font from combining two characters like "fi"
 html {
     font-feature-settings: "liga" 0;
-    text-rendering: optimizeLegibility;
+    text-rendering: optimizelegibility;
 }
 
 body {
@@ -45,8 +45,6 @@ hr {
 figure {
     @apply mt-2 mb-4 mx-auto;
 
-    // Overriding display: inline-block; from CKEditor
-    // so that the caption wraps appropriately
     display: table !important;
     padding: 0 !important;
     clear: both;

resources/scss/components/_menu-main.scss

@@ -13,7 +13,7 @@
         @apply text-black block p-2 px-3;
     }
 
-    // Indent each level
+    /* Indent each level */
     li > ul > li a {
         @apply pl-8;
     }
@@ -30,19 +30,19 @@
         @apply bg-gray-200;
     }
 
-    // Bottom borders on child <li>
+    /* Bottom borders on child <li> */
     > li {
         @screen mt {
             @apply border-b border-solid border-gray-200;
         }
     }
 
-    // Selected State
+    /* Selected State */
     .selected {
         @apply font-bold;
     }
 
-    // Don't cascade the selected state to child lists of the item
+    /* Don't cascade the selected state to child lists of the item */
     .selected ul {
         @apply font-normal;
     }

resources/scss/components/_policy-numbering.scss

@@ -25,7 +25,7 @@
             left: 0;
         }
 
-        @media only screen and (max-width: 576px) {
+        @media only screen and (width <= 576px) {
             padding-left: 2rem;
         }
     }
@@ -42,7 +42,7 @@
             margin-bottom: 1rem;
             font-size: 0.9rem;
 
-            @media only screen and (max-width: 576px) {
+            @media only screen and (width <= 576px) {
                 padding-left: 2rem;
             }
         }
@@ -57,7 +57,7 @@
         counter-reset: section;
         margin-left: 1rem;
 
-        @media only screen and (max-width: 576px) {
+        @media only screen and (width <= 576px) {
             margin-left: -0.5rem;
         }
 
@@ -68,7 +68,7 @@
             font-size: 0.9rem;
             list-style-type: lower-alpha;
 
-            @media only screen and (max-width: 576px) {
+            @media only screen and (width <= 576px) {
                 padding-left: 0.5rem;
             }
         }
@@ -79,7 +79,7 @@
     }
 
     ul li ul {
-        @media only screen and (max-width: 576px) {
+        @media only screen and (width <= 576px) {
             margin-left: 0.5rem;
         }
 
@@ -90,7 +90,7 @@
             font-size: 0.9rem;
             list-style-type: lower-roman;
 
-            @media only screen and (max-width: 576px) {
+            @media only screen and (width <= 576px) {
                 padding-left: 0.5rem;
             }
         }

resources/scss/site-specific/_theme.scss

@@ -1,5 +1,5 @@
 // The site-theme class encompasses the content-area component.
 
 .site-theme {
-    //h1, h2 { @extend .divider-gold; @apply text-green; }
+    /* h1, h2 { @extend .divider-gold;  @apply text-green; } */
 }