Rename missing color variables

packages/@uppy/drag-drop/src/style.scss

@@ -6,7 +6,7 @@
   align-items: center;
   justify-content: center;
   border-radius: 7px;
-  background-color: $color-white;
+  background-color: $white;
   // cursor: pointer;
 }
 
@@ -20,13 +20,13 @@
 .uppy-DragDrop-arrow {
   width: 60px;
   height: 60px;
-  fill: lighten($color-gray, 30%);
+  fill: lighten($gray-500, 30%);
   margin-bottom: 17px;
 }
 
   .uppy-DragDrop--is-dragdrop-supported {
     border: 2px dashed;
-    border-color: lighten($color-gray, 10%);
+    border-color: lighten($gray-500, 10%);
   }
 
   // .uppy-DragDrop-container.is-dragdrop-supported .uppy-DragDrop-dragText {
@@ -34,12 +34,12 @@
   // }
 
   .uppy-DragDrop-container.drag {
-    border-color: $color-gray;
-    background-color: darken($color-white, 10%);
+    border-color: $gray-500;
+    background-color: darken($white, 10%);
   }
 
   .uppy-DragDrop-container.drag .uppy-DragDrop-arrow {
-    fill: $color-gray;
+    fill: $gray-500;
   }
 
 .uppy-DragDrop-label {
@@ -51,9 +51,9 @@
 
 .uppy-DragDrop-note {
   font-size: 1em;
-  color: lighten($color-gray, 10%);
+  color: lighten($gray-500, 10%);
 }
 
 .uppy-DragDrop-dragText {
-  color: $color-blue;
+  color: $blue;
 }

packages/@uppy/file-input/src/style.scss

@@ -12,13 +12,13 @@
   font-size: 0.85em;
   // text-transform: uppercase;
   padding: 10px 15px;
-  color: darken($color-blue, 20%);
-  border: 1px solid darken($color-blue, 20%);
+  color: darken($blue, 20%);
+  border: 1px solid darken($blue, 20%);
   border-radius: 8px;
   cursor: pointer;
 
   &:hover {
-    background-color: darken($color-blue, 20%);
-    color: $color-white;
+    background-color: darken($blue, 20%);
+    color: $white;
   }
 }

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

@@ -19,8 +19,8 @@
 
 .uppy-ProgressBar-inner {
   /* no important */
-  background-color: $color-blue;
-  box-shadow: 0 0 10px rgba($color-blue, 0.7);
+  background-color: $blue;
+  box-shadow: 0 0 10px rgba($blue, 0.7);
   height: 100%;
   width: 0;
   transition: width 0.4s ease;
@@ -34,5 +34,5 @@
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
-  color: $color-white;
+  color: $white;
 }