Merge branch 'master' into feature/UIDS-24-flash-component

Author: Rachel Roppolo

scss/palette.scss

@@ -1,3 +1,5 @@
+// When updating this file, please consider the values in src/Styles/palette.js
+
 $ux-black: #000000;
 $ux-blue: #337ab7;
 $ux-dark-blue: #639BB8;

scss/theme.scss

@@ -1,6 +1,7 @@
 @import './lists';
 @import './palette';
 @import './typography';
+@import './z_stack';
 
 $ui-navbar-height: 3rem;
 $ui-navbar-height-mobile: $ui-navbar-height;

scss/z_stack.scss

@@ -0,0 +1,33 @@
+/* ========================================
+  Add z-index variable declarations here.
+  Name according to level.
+
+  If you defined a usage specific z-index variable,
+  make sure it is referencing a level-named variable.
+======================================== */
+
+// Note look to update `z_stack.js` when changing these
+
+// By Level
+$z-index-1045: 1045;
+$z-index-1040: 1040;
+$z-index-1030: 1030;
+$z-index-1025: 1025;
+$z-index-1020: 1020;
+
+$z-index-115: 115;
+$z-index-100: 100;
+
+$z-index-30: 30;
+$z-index-20: 20;
+$z-index-10: 10;
+$z-index-3: 3;
+$z-index-2: 2;
+$z-index-1: 1;
+
+// By Purpose
+$z-index-flash: $z-index-1045;
+$z-index-drawer: $z-index-1040;
+$z-index-modal-backdrop: $z-index-1040; // Matches bootstrap $zindex-modal-backdrop
+$z-index-fixed: $z-index-1030; //Matches bootstrap $zindex-fixed
+$z-index-overlay: $z-index-fixed - 1; // Sits just under $z-index-fixed

src/Styles/palette.js

@@ -0,0 +1,28 @@
+// This can probably be generated... try to group the colors spatially plz
+
+export default {
+  uxBlack: '#000000',
+  uxBlue: '#337ab7',
+
+  uxGreen100: '#F3FFF2',
+  uxGreen200: '#E3FDE0',
+  uxGreen500: '#6DBD63',
+  uxGreen600: '#47A13B',
+
+  uxGray100: '#F9F9F9',
+  uxGray200: '#F1F1F1',
+  uxGray500: '#A1A1A1',
+  uxGray600: '#818181',
+
+  uxOrange100: '#FDEAD2',
+  uxOrange200: '#FCDFB9',
+  uxOrange500: '#F59C27',
+  uxOrange600: '#E18C28',
+
+  uxRed100: '#F0D9D9',
+  uxRed200: '#E8C5CB',
+  uxRed500: '#FF4E00',
+  uxRed600: '#C71F1F',
+
+  uxWhite: '#FFFFFF',
+};

src/Styles/zStack.js

@@ -0,0 +1,26 @@
+// This can probably be generated... see work on palette.js
+
+export default {
+  zIndex1045: 1045,
+  zIndex1040: 1040,
+  zIndex1030: 1030,
+  zIndex1025: 1025,
+  zIndex1020: 1020,
+
+  zIndex115: 115,
+  zIndex100: 100,
+
+  zIndex30: 30,
+  zIndex20: 20,
+  zIndex10: 10,
+  zIndex3: 3,
+  zIndex2: 2,
+  zIndex1: 1,
+
+  // By Purpose
+  zIndexFlash: 1045,
+  zIndexDrawer: 1040,
+  zIndexModalBackdrop: 1040, // Matches bootstrap $zindex-modal-backdrop
+  zIndexFixed: 1030, // Matches bootstrap $z-index-fixed
+  zIndexOverlay: 1029, // Sits just under $z-index-fixed
+};