update dependencies and refactor CSS to match

.stylelintrc.yml

@@ -1,8 +1,4 @@
-extends: stylelint-config-recommended
-syntax: scss
-plugins:
-  - stylelint-scss
+extends: stylelint-config-standard-scss
 rules:
-  # Use scss/at-rule-no-unknown instead of core/at-rule-no-unknown to allow SCSS @rules.
-  at-rule-no-unknown: null
-  scss/at-rule-no-unknown: true
+  selector-class-pattern: null
+  scss/at-extend-no-missing-placeholder: null

Gemfile.lock

@@ -9,28 +9,28 @@ GIT
 GEM
   remote: https://rubygems.org/
   specs:
-    activesupport (5.2.6)
+    activesupport (5.2.8.1)
       concurrent-ruby (~> 1.0, >= 1.0.2)
       i18n (>= 0.7, < 2)
       minitest (~> 5.1)
       tzinfo (~> 1.1)
-    addressable (2.8.0)
-      public_suffix (>= 2.0.2, < 5.0)
+    addressable (2.8.6)
+      public_suffix (>= 2.0.2, < 6.0)
     colorator (1.1.0)
     colorize (0.8.1)
-    concurrent-ruby (1.1.9)
-    em-websocket (0.5.2)
+    concurrent-ruby (1.2.3)
+    em-websocket (0.5.3)
       eventmachine (>= 0.12.9)
-      http_parser.rb (~> 0.6.0)
+      http_parser.rb (~> 0)
     eslintrb (2.1.0)
       execjs
       multi_json (>= 1.3)
       rake
-    ethon (0.14.0)
+    ethon (0.16.0)
       ffi (>= 1.15.0)
     eventmachine (1.2.7)
-    execjs (2.8.1)
-    ffi (1.15.4)
+    execjs (2.9.1)
+    ffi (1.16.3)
     forwardable-extended (2.6.0)
     hawkins (2.0.5)
       em-websocket (~> 0.5)
@@ -45,14 +45,14 @@ GEM
       typhoeus (~> 1.3)
       yell (~> 2.0)
     htmlentities (4.3.4)
-    http_parser.rb (0.6.0)
-    i18n (0.9.5)
+    http_parser.rb (0.8.0)
+    i18n (1.14.1)
       concurrent-ruby (~> 1.0)
-    jekyll (3.9.1)
+    jekyll (3.9.5)
       addressable (~> 2.4)
       colorator (~> 1.0)
       em-websocket (~> 0.5)
-      i18n (~> 0.7)
+      i18n (>= 0.7, < 2)
       jekyll-sass-converter (~> 1.0)
       jekyll-watch (~> 2.0)
       kramdown (>= 1.17, < 3)
@@ -63,58 +63,56 @@ GEM
       safe_yaml (~> 1.0)
     jekyll-sass-converter (1.5.2)
       sass (~> 3.4)
-    jekyll-toc (0.17.1)
+    jekyll-toc (0.18.0)
       jekyll (>= 3.9)
-      nokogiri (~> 1.11)
+      nokogiri (~> 1.12)
     jekyll-watch (2.2.1)
       listen (~> 3.0)
-    json-schema (2.8.1)
-      addressable (>= 2.4)
-    kramdown (2.3.1)
+    json-schema (4.1.1)
+      addressable (>= 2.8)
+    kramdown (2.4.0)
       rexml
     kramdown-parser-gfm (1.1.0)
       kramdown (~> 2.0)
-    liquid (4.0.3)
-    listen (3.7.0)
+    liquid (4.0.4)
+    listen (3.8.0)
       rb-fsevent (~> 0.10, >= 0.10.3)
       rb-inotify (~> 0.9, >= 0.9.10)
     mercenary (0.3.6)
-    mini_portile2 (2.8.1)
-    minitest (5.14.4)
+    minitest (5.22.2)
     multi_json (1.15.0)
-    nokogiri (1.14.0)
-      mini_portile2 (~> 2.8.0)
+    nokogiri (1.16.2-x86_64-linux)
       racc (~> 1.4)
-    parallel (1.21.0)
+    parallel (1.24.0)
     pathutil (0.16.2)
       forwardable-extended (~> 2.6)
-    power_assert (2.0.1)
-    public_suffix (4.0.6)
-    racc (1.6.2)
-    rake (13.0.6)
-    rb-fsevent (0.11.0)
+    power_assert (2.0.3)
+    public_suffix (5.0.4)
+    racc (1.7.3)
+    rake (13.1.0)
+    rb-fsevent (0.11.2)
     rb-inotify (0.10.1)
       ffi (~> 1.0)
-    rexml (3.2.5)
-    rouge (3.26.1)
+    rexml (3.2.6)
+    rouge (3.30.0)
     safe_yaml (1.0.5)
     sass (3.7.4)
       sass-listen (~> 4.0.0)
     sass-listen (4.0.0)
       rb-fsevent (~> 0.9, >= 0.9.4)
       rb-inotify (~> 0.9, >= 0.9.7)
-    test-unit (3.4.7)
+    test-unit (3.6.1)
       power_assert
     thread_safe (0.3.6)
-    typhoeus (1.4.0)
+    typhoeus (1.4.1)
       ethon (>= 0.9.0)
-    tzinfo (1.2.10)
+    tzinfo (1.2.11)
       thread_safe (~> 0.1)
-    webrick (1.7.0)
+    webrick (1.8.1)
     yell (2.2.2)
 
 PLATFORMS
-  ruby
+  x86_64-linux
 
 DEPENDENCIES
   eslintrb
@@ -130,4 +128,4 @@ DEPENDENCIES
   webrick (~> 1.7)
 
 BUNDLED WITH
-   2.2.3
+   2.3.26

_sass/_apidocs.scss

@@ -1,15 +1,15 @@
 /* swagger specific formatting */
-@media (min-width: 600px) {
+@media (width >= 600px) {
 .sidebar-sticky {
-  position: -webkit-sticky;
   position: sticky;
-  top: 0px;
+  top: 0;
 }
 }
+
 .swagger-ui .topbar {
   display: none !important;
 }
 
 section.swagger-ui, section .swagger-ui section {
-  padding: 0px;
+  padding: 0;
 }

_sass/_banners.scss

@@ -6,6 +6,7 @@
   color: $banner-text-color;
   margin-bottom: 75px;
 }
+
 .banner.tagline h2 {
   color: $banner-text-color;
   margin-top: 75px;
@@ -14,13 +15,16 @@
 .banner.roles {
   background-color: #e4e2e0;
 }
+
 .banner.roles .usa-grid {
   padding: 3rem;
 }
+
 .banner.roles p {
   color: #323a45;
   margin-bottom: 75px;
 }
+
 .banner.roles h2 {
   color: #323a45;
   margin-top: 75px;
@@ -30,9 +34,11 @@
 .banner.contact {
   background-color: #112e51;
 }
+
 .banner.contact form {
   padding-top: 2em;
 }
+
 .banner.contact h2,
 .banner.contact p,
 .banner.contact legend,
@@ -46,4 +52,4 @@
 .banner-header {
   padding-top: 1.5em;
   padding-bottom: 1.5em;
-}
+}

_sass/_base.scss

@@ -4,17 +4,21 @@ body{
   height:100%;
   overflow-x: auto; // This is in particular due to wide tables in API docs.
 }
+
 #wrapper {
 	min-height:100%;
 	position:relative;
 }
+
 #header{
   margin-bottom: -20px;
 }
+
 #content{
   padding-bottom:200px;
   min-height: 95vh;
 }
+
 #footer {
 	width:100%;
 	height:200px;
@@ -23,11 +27,11 @@ body{
 	left:0;
 }
 
-
 body,
 p, ul, ol, li, a  {
   color: $text-color;
 }
+
 legend, label,
 h1, h2, h3, h4, h5, h6 {
   color: $headers-color;
@@ -38,15 +42,19 @@ h1, h2, h3, h4, h5, h6 {
   margin-bottom: 20px;
   color: $header-text-color;
 }
+
 ul, li {
   margin-bottom: 0;
 }
+
 main {
   margin-bottom: 1em;
 }
+
 form {
   max-width: 100%;
 }
+
 .usa-content > p,
 .usa-content > ul,
 .usa-content > ol,
@@ -58,13 +66,17 @@ form {
 .usa-content > h6 {
   max-width: 62.5rem;
 }
+
 a {
   color: #0071bc; }
-  a:hover, a:active {
+
+a:hover, a:active {
     color: #205493; }
-  a:visited {
+
+a:visited {
     color: inherit; }
-  a:focus {
+
+a:focus {
     box-shadow: 0 0 3px #3e94cf, 0 0 7px #3e94cf;
     outline: 0; }
 
@@ -76,6 +88,7 @@ div.skip-nav a {
   height: auto;
   overflow: hidden;
 }
+
 div.skip-nav a:focus {
   position: absolute;
   top: 5px;
@@ -88,16 +101,17 @@ div.skip-nav a:focus {
   padding-right: 2px;
   overflow: visible;
 }
+
 #main:focus {
   outline: none;
 }
 
-@media (min-width: 600px) {
+@media (width >= 600px) {
   .usa-width-one-whole.usa-content {
     position: relative;
     left: 50%;
     max-width: 62.5rem;
     margin-left: -31.25rem;
   }
 
-}
+}

_sass/_data-listing.scss

@@ -3,10 +3,8 @@
 $grey: #efefef;
 $green: #2e8540;
 $black: #000;
-
-$border-radius:3px;
-$box-shadow:0 1px 4px rgba($black, .3);
-
+$border-radius: 3px;
+$box-shadow: 0 1px 4px rgba($black, .3);
 
 article.data-listing {
 	width: 100%;
@@ -15,37 +13,47 @@ article.data-listing {
   margin: 40px;
   margin-bottom: 40px;
 	box-shadow: $box-shadow;
+
   h3 {
-    font-family: Source Sans Pro, sans-serif;
+    font-family: 'Source Sans Pro', sans-serif;
 		color: #112e51;
   }
-	p {
+
+  p {
 		color: #212121;
 	}
+
   header, .content, footer {
     padding: 1rem 2rem;
     }
+
   header {
     background-color: $grey;
   }
+
   .content {
     padding:14px 24px;
 		background-color: #fff;
   }
+
   .content:first-child {
     margin-top: 1rem;
   }
-	.title {
+
+  .title {
     margin: 0;
     font-size: 2.5rem;
 	}
-	.txt {
+
+  .txt {
 		line-height: 1.5;
 	}
+
   button a{
     text-decoration: none;
   }
-	footer {
+
+  footer {
     background: $green;
 	}
 }