Lots of scss-lint fixes, with minor tweaks to linter config

.scss-lint.yml

@@ -22,6 +22,9 @@ linters:
     enabled: false
   DuplicateProperty:
     enabled: true
+    ignore_consecutive:
+      - background
+      - background-image
   ElsePlacement:
     enabled: true
     style: same_line
@@ -90,7 +93,7 @@ linters:
     severity: warning
   SelectorDepth:
     enabled: true
-    max_depth: 2
+    max_depth: 3
     severity: warning
   SelectorFormat:
     enabled: false # strict_BEM doesn't seem to be supported by Hound

src/stylesheets/components/_accordions.scss

@@ -57,7 +57,12 @@ $accordion-border: 3px solid $color-gray-lightest;
       color: $color-base;
     }
 
-    h1, h2, h3, h4, h5, h6 {
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
       margin: 0;
     }
   }

src/stylesheets/components/_alerts.scss

@@ -1,5 +1,5 @@
 .usa-alert {
-  background-color: $color-gray-lightest;  
+  background-color: $color-gray-lightest;
   background-position: 1rem 2rem;
   background-repeat: no-repeat;
   background-size: 4rem;
@@ -34,7 +34,7 @@
 .usa-alert-heading {
   margin-bottom: .3rem;
   margin-top: 0;
-  
+
   @include media($medium-screen) {
     margin-top: .3rem;
   }
@@ -48,28 +48,28 @@
 
 .usa-alert-success {
   background-color: $color-green-lightest;
-  background-image: url('../img/alerts/success.png');  
-  background-image: url('../img/alerts/success.svg');  
+  background-image: url('../img/alerts/success.png');
+  background-image: url('../img/alerts/success.svg');
 }
 
 .usa-alert-warning {
   background-color: $color-gold-lightest;
-  background-image: url('../img/alerts/warning.png');  
-  background-image: url('../img/alerts/warning.svg');   
+  background-image: url('../img/alerts/warning.png');
+  background-image: url('../img/alerts/warning.svg');
 }
 
 .usa-alert-error {
   background-color: $color-secondary-lightest;
-  background-image: url('../img/alerts/error.png');  
-  background-image: url('../img/alerts/error.svg');   
+  background-image: url('../img/alerts/error.png');
+  background-image: url('../img/alerts/error.svg');
 }
 
 .usa-alert-info {
   background-color: $color-primary-alt-lightest;
-  background-image: url('../img/alerts/info.png');  
-  background-image: url('../img/alerts/info.svg');   
+  background-image: url('../img/alerts/info.png');
+  background-image: url('../img/alerts/info.svg');
 }
 
 .usa-alert-no_icon {
- background-image: none; 
+  background-image: none;
 }

src/stylesheets/components/_disclaimer.scss

@@ -9,7 +9,7 @@
   }
 }
 
-// This hides the stage note (i.e. alpha, beta, etc) of the disclaimer for 
+// This hides the stage note (i.e. alpha, beta, etc) of the disclaimer for
 // anything smaller than large screen sizes
 .usa-disclaimer-stage {
   display: none;

src/stylesheets/components/_footer.scss

@@ -22,7 +22,7 @@
 }
 
 .usa-footer-return-to-top {
-  padding-bottom: 2rem;    
+  padding-bottom: 2rem;
   padding-top: 2rem;
 }
 
@@ -44,7 +44,7 @@
       @include media($medium-screen) {
         margin-left: 0;
       }
-    } 
+    }
   }
 
   .usa-grid-full {
@@ -58,7 +58,7 @@
 .usa-footer-medium {
   .usa-footer-primary-section {
     padding: 0;
-    
+
     @include media($medium-screen) {
       padding-bottom: 1rem;
       padding-top: 1rem;
@@ -68,9 +68,9 @@
   .usa-footer-nav ul {
     @include media($medium-screen) {
       align-items: center;
-      display: flex;  
+      display: flex;
     }
-  }  
+  }
 }
 
 .usa-footer-slim {
@@ -80,23 +80,23 @@
 
   .usa-footer-primary-section {
     padding-bottom: 2rem;
-    
+
     @include media($medium-screen) {
       padding-bottom: 1rem;
       padding-top: 1rem;
 
       .usa-grid-full {
         align-items: center;
-        display: flex;     
-      }      
+        display: flex;
+      }
     }
   }
 }
 
 ul.usa-footer-primary-content,
 li.usa-footer-primary-content,
 li.usa-footer-primary-content {
-  border-top: 1px solid $color-base;      
+  border-top: 1px solid $color-base;
 
   @include media($medium-screen) {
     border: none;
@@ -133,7 +133,7 @@ li.usa-footer-primary-content {
 
   input {
     width: 100%;
-  }  
+  }
 }
 
 .usa-footer-secondary_section {
@@ -149,7 +149,7 @@ li.usa-footer-primary-content {
 .usa-footer-big-secondary-section {
   @include media($medium-screen) {
     padding-top: 5rem;
-  }  
+  }
 }
 
 .usa-footer-contact-links {
@@ -172,7 +172,7 @@ li.usa-footer-primary-content {
     @include media($medium-screen) {
       padding-bottom: 0;
     }
-    
+
     &:last-child {
       border-bottom: 1px solid $color-base;
 
@@ -203,7 +203,7 @@ li.usa-footer-primary-content {
     &.hidden {
       padding-bottom: 0;
 
-      .usa-footer-primary-link { 
+      .usa-footer-primary-link {
         background-image: url('../img/arrow-right.png');
         background-image: url('../img/arrow-right.svg');
         cursor: pointer;
@@ -212,9 +212,9 @@ li.usa-footer-primary-content {
         @include media($medium-screen) {
           background: none;
           padding-left: 0;
-        }        
+        }
       }
-        
+
       li { display: none; }
     }
   }
@@ -238,7 +238,7 @@ li.usa-footer-primary-content {
 
 .usa-footer-slim-logo-img {
   float: left;
-  max-width: 10rem; 
+  max-width: 10rem;
 }
 
 .usa-footer-logo-heading {
@@ -247,9 +247,9 @@ li.usa-footer-primary-content {
 
 .usa-footer-contact-heading {
   margin-top: 0;
-  
+
   @include media($medium-screen) {
-    margin-top: 1rem;  
+    margin-top: 1rem;
   }
 }
 

src/stylesheets/components/_forms.scss

@@ -22,7 +22,8 @@ form {
     }
   }
 
-  input[name="password"], input[name="confirmPassword"] {
+  input[name="password"],
+  input[name="confirmPassword"] {
     margin-bottom: 1.1rem;
   }
 }
@@ -33,7 +34,7 @@ form {
   font-size: $h5-font-size;
   margin: 0 0 1.5rem;
 
-  & + * {
+  + * {
     clear: both;
   }
 }
@@ -154,7 +155,7 @@ input.usa-input-medium {
     padding-left: 3em;
     text-indent: -2em;
 
-    &:before {
+    &::before {
       content: ' ';
       display: inline-block;
       height: .8em;
@@ -165,7 +166,7 @@ input.usa-input-medium {
 }
 
 .usa-checklist-checked {
-  &:before {
+  &::before {
     background-image: url('../img/correct9.png');
     background-image: url('../img/correct9.svg');
     background-position: 100%;

src/stylesheets/core/_base.scss

@@ -1,11 +1,13 @@
-/* Apply a natural box layout model to all elements, but allowing components to 
-change */
+// Apply a natural box layout model to all elements, but allowing components to
+// change
 
 html {
   box-sizing: border-box;
 }
 
-*, *:before, *:after {
+*,
+*::before,
+*::after {
   box-sizing: inherit;
 }
 

src/stylesheets/core/_defaults.scss

@@ -2,6 +2,8 @@
 // Do not modify.
 // These variables can be modified in _variables.scss
 
+// scss-lint:
+
 // Typography
 $em-base:             10px; // default is already defined in bourbon
 $base-font-size:      rem(17px) !default;
@@ -75,6 +77,8 @@ $color-cool-blue-lightest:   #dce4ef !default; // lighten($color-cool-blue, 90%)
 $color-focus:                #3e94cf !default;
 $color-visited:              #4c2c92 !default;
 
+$color-shadow:               rgba(#000, 0.3) !default;
+
 
 // Mobile First Breakpoints
 $small-screen:      481px !default;
@@ -89,6 +93,6 @@ $site-margins:      3rem !default;
 $article-max-width: 600px !default;
 $input-max-width:   46rem !default;
 $border-radius:     rem(3px) !default;
-$box-shadow:        0 0 2px rgba(#000, 0.3) !default;
+$box-shadow:        0 0 2px $color-shadow !default;
 $focus-shadow:      0 0 3px $color-focus, 0 0 7px $color-focus !default;
 $grid-margins:      3rem !default;

src/stylesheets/core/_grid.scss

@@ -7,35 +7,43 @@
     .usa-width-one-whole {
       @include span-columns(6);
     }
+
     .usa-width-one-half {
       @include span-columns(3);
     }
+
     .usa-width-one-third {
       @include span-columns(2);
     }
+
     .usa-width-two-thirds {
       @include span-columns(4);
     }
+
     .usa-width-one-fourth {
       @include span-columns(3);
 
       &:nth-child(2n) {
         margin-right: 0;
       }
     }
+
     .usa-width-three-fourths {
       @include span-columns(6);
     }
+
     .usa-width-one-sixth {
       @include span-columns(2);
 
       &:nth-child(3n) {
         margin-right: 0;
       }
     }
+
     .usa-width-five-sixths {
       @include span-columns(4);
     }
+
     .usa-width-one-twelfth {
       @include span-columns(2);
 
@@ -49,15 +57,19 @@
     .usa-width-one-whole {
       @include span-columns(12);
     }
+
     .usa-width-one-half {
       @include span-columns(6);
     }
+
     .usa-width-one-third {
       @include span-columns(4);
     }
+
     .usa-width-two-thirds {
       @include span-columns(8);
     }
+
     .usa-width-one-fourth {
       @include span-columns(3);
 
@@ -69,9 +81,11 @@
         margin-right: 0;
       }
     }
+
     .usa-width-three-fourths {
       @include span-columns(9);
     }
+
     .usa-width-one-sixth {
       @include span-columns(2);
 
@@ -83,9 +97,11 @@
         margin-right: 0;
       }
     }
+
     .usa-width-five-sixths {
       @include span-columns(10);
     }
+
     .usa-width-one-twelfth {
       @include span-columns(1);