Merge release/1.35.0 into main branch (#744)

* make modal prop work with all Selects (#743)

* Fix color system JS variable order (#739)

Fixes the 500 level color values for green and navy. This is because the variables for 500 were used as the
non-numbered values but those don't always correspond to the 500 value.
I set them all to the 500 variables for consistency.

* Prepare release 1.35.0

Author: github-actions[bot]

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@user-interviews/ui-design-system",
-  "version": "1.34.3",
+  "version": "1.35.0",
   "dependencies": {
     "react-bootstrap": "^2.0.2",
     "react-router-dom": "^5.2.0",

scss/variables.scss

@@ -15,11 +15,12 @@
   UX_TEAL: $ux-teal;
   UX_YELLOW: $ux-yellow;
   UX_WHITE: $ux-white;
+
   UX_BLUE_100: $ux-blue-100;
   UX_BLUE_200: $ux-blue-200;
   UX_BLUE_300: $ux-blue-300;
   UX_BLUE_400: $ux-blue-400;
-  UX_BLUE_500: $ux-blue;
+  UX_BLUE_500: $ux-blue-500;
   UX_BLUE_600: $ux-blue-600;
   UX_BLUE_700: $ux-blue-700;
   UX_BLUE_800: $ux-blue-800;
@@ -29,7 +30,7 @@
   UX_EMERALD_200: $ux-emerald-200;
   UX_EMERALD_300: $ux-emerald-300;
   UX_EMERALD_400: $ux-emerald-400;
-  UX_EMERALD_500: $ux-emerald;
+  UX_EMERALD_500: $ux-emerald-500;
   UX_EMERALD_600: $ux-emerald-600;
   UX_EMERALD_700: $ux-emerald-700;
   UX_EMERALD_800: $ux-emerald-800;
@@ -39,7 +40,7 @@
   UX_GRAY_200: $ux-gray-200;
   UX_GRAY_300: $ux-gray-300;
   UX_GRAY_400: $ux-gray-400;
-  UX_GRAY_500: $ux-gray;
+  UX_GRAY_500: $ux-gray-500;
   UX_GRAY_600: $ux-gray-600;
   UX_GRAY_700: $ux-gray-700;
   UX_GRAY_800: $ux-gray-800;
@@ -49,7 +50,7 @@
   UX_GREEN_200: $ux-green-200;
   UX_GREEN_300: $ux-green-300;
   UX_GREEN_400: $ux-green-400;
-  UX_GREEN_500: $ux-green;
+  UX_GREEN_500: $ux-green-500;
   UX_GREEN_600: $ux-green-600;
   UX_GREEN_700: $ux-green-700;
   UX_GREEN_800: $ux-green-800;
@@ -59,7 +60,7 @@
   UX_NAVY_200: $ux-navy-200;
   UX_NAVY_300: $ux-navy-300;
   UX_NAVY_400: $ux-navy-400;
-  UX_NAVY_500: $ux-navy;
+  UX_NAVY_500: $ux-navy-500;
   UX_NAVY_600: $ux-navy-600;
   UX_NAVY_700: $ux-navy-700;
   UX_NAVY_800: $ux-navy-800;
@@ -79,7 +80,7 @@
   UX_ORANGE_200: $ux-orange-200;
   UX_ORANGE_300: $ux-orange-300;
   UX_ORANGE_400: $ux-orange-400;
-  UX_ORANGE_500: $ux-orange;
+  UX_ORANGE_500: $ux-orange-500;
   UX_ORANGE_600: $ux-orange-600;
   UX_ORANGE_700: $ux-orange-700;
   UX_ORANGE_800: $ux-orange-800;
@@ -89,7 +90,7 @@
   UX_RED_200: $ux-red-200;
   UX_RED_300: $ux-red-300;
   UX_RED_400: $ux-red-400;
-  UX_RED_500: $ux-red;
+  UX_RED_500: $ux-red-500;
   UX_RED_600: $ux-red-600;
   UX_RED_700: $ux-red-700;
   UX_RED_800: $ux-red-800;
@@ -99,7 +100,7 @@
   UX_SAND_200: $ux-sand-200;
   UX_SAND_300: $ux-sand-300;
   UX_SAND_400: $ux-sand-400;
-  UX_SAND_500: $ux-sand;
+  UX_SAND_500: $ux-sand-500;
   UX_SAND_600: $ux-sand-600;
   UX_SAND_700: $ux-sand-700;
   UX_SAND_800: $ux-sand-800;
@@ -111,15 +112,15 @@
   UX_TEAL_400: $ux-teal-400;
   UX_TEAL_500: $ux-teal-500;
   UX_TEAL_600: $ux-teal-600;
-  UX_TEAL_700: $ux-teal;
+  UX_TEAL_700: $ux-teal-500;
   UX_TEAL_800: $ux-teal-800;
   UX_TEAL_900: $ux-teal-900;
 
   UX_YELLOW_100: $ux-yellow-100;
   UX_YELLOW_200: $ux-yellow-200;
   UX_YELLOW_300: $ux-yellow-300;
   UX_YELLOW_400: $ux-yellow-400;
-  UX_YELLOW_500: $ux-yellow;
+  UX_YELLOW_500: $ux-yellow-500;
   UX_YELLOW_600: $ux-yellow-600;
   UX_YELLOW_700: $ux-yellow-700;
   UX_YELLOW_800: $ux-yellow-800;