Using variables for lightgray color; Lowercased color codes

packages/@uppy/core/src/_variables.scss

@@ -6,16 +6,17 @@ $font-family-base: system-ui, -apple-system, BLinkMacSystemFont, Segoe UI, Robot
 
 $color-black: #333 !default;
 $color-gray: #939393 !default;
-$color-red: #D32F2F !default;
-$color-green: #1BB240 !default;
-$color-orange: #F6A623 !default;
-$color-yellow: #FFD600 !default;
+$color-red: #d32f2f !default;
+$color-green: #1bb240 !default;
+$color-orange: #f6a623 !default;
+$color-yellow: #ffd600 !default;
 $color-white: #fff !default;
-$color-almost-white: #FAFAFA !default;
-$color-cornflower-blue: #2275D7 !default;
+$color-lightgray: #eaeaea;
+$color-almost-white: #fafafa !default;
+$color-cornflower-blue: #2275d7 !default;
 $color-asphalt-gray: #525252 !default;
 
-$color-uppy-pink: #EB2177;
+$color-uppy-pink: #eb2177;
 
 // Sizes
 

packages/@uppy/dashboard/src/style.scss

@@ -370,7 +370,7 @@
   justify-content: space-between;
   height: 40px;
   width: 100%;
-  border-bottom: 1px solid #eaeaea;
+  border-bottom: 1px solid $color-lightgray;
   z-index: $zIndex-4;
   background-color: $color-almost-white;
   padding: 0 10px;
@@ -1071,7 +1071,7 @@ a.uppy-Dashboard-poweredBy {
 
 .uppy-Dashboard-actions {
   height: 55px;
-  border-top: 1px solid #eaeaea;
+  border-top: 1px solid $color-lightgray;
   display: flex;
   align-items: center;
   padding: 0 15px;
@@ -1165,7 +1165,7 @@ a.uppy-Dashboard-poweredBy {
   align-items: center;
   justify-content: center;
   flex-grow: 1;
-  border-bottom: 1px solid #eaeaea;
+  border-bottom: 1px solid $color-lightgray;
   background-color: lighten($color-gray, 40%); /* no !important */
   position: relative;
 }

packages/@uppy/provider-views/src/style.scss

@@ -99,7 +99,7 @@
 
 .uppy-ProviderBrowser-header {
   z-index: $zIndex-2;
-  border-bottom: 1px solid #eaeaea;
+  border-bottom: 1px solid $color-lightgray;
   position: relative;
 }
 
@@ -463,7 +463,7 @@
   align-items: center;
   background: $color-white;
   height: 65px;
-  border-top: 1px solid #eaeaea;
+  border-top: 1px solid $color-lightgray;
   padding: 0 15px;
 
   & button {

packages/@uppy/status-bar/src/style.scss

@@ -52,7 +52,7 @@
 .uppy-StatusBar:not([aria-hidden=true]).is-waiting {
   background-color: $color-white;
   height: 65px;
-  border-top: 1px solid #eaeaea;
+  border-top: 1px solid $color-lightgray;
 }
 
 .uppy-StatusBar-progress {