Update application navigation colors
- Current navigation color did not match mockup
- Replace color variables with theme variables in .vue file
- Add $gray-500
- Delete the map-remove functions. Maps are based on the added
properties
- Increase navigaton icon size
- Add _variables.scss file for overrides to Bootstrap Sass
variables and adding custom variables
Testing:
1. Navigation item for current page will have a dark background,
light text, and a blue border.
2. Hovering over an active navigation item will display the cursor as
the default arrow.
Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: Id391364ee74ece59ba7b20d49fda859de0c12b17
diff --git a/src/assets/styles/_variables.scss b/src/assets/styles/_variables.scss
new file mode 100644
index 0000000..f59cfc1
--- /dev/null
+++ b/src/assets/styles/_variables.scss
@@ -0,0 +1,12 @@
+@import "./colors";
+
+// Override Bootstrap Variables - node_modules/Bootstrap/scss/_variables.scss
+$enable-rounded: false;
+$enable-validation-icons: false;
+
+// OpenBMC Custom Variables
+$responsive-layout-bp: lg;
+$header-height: 56px;
+$navigation-width: 300px;
+$container-bgd: $gray-200;
+$primary-nav-hover: $gray-300;
\ No newline at end of file