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

1 files changed, 2 insertions, 19 deletions

diff --git a/src/assets/styles/_obmc-custom.scss b/src/assets/styles/_obmc-custom.scss
index 7328bb05..09240705 100644
--- a/src/assets/styles/_obmc-custom.scss
+++ b/src/assets/styles/_obmc-custom.scss
@@ -1,27 +1,10 @@
-$enable-rounded: false;
-$enable-validation-icons: false;
-$responsive-layout-bp: lg;
-$header-height: 56px;
-$navigation-width: 300px;
-
-// Required
+@import "./variables";
 @import "~bootstrap/scss/functions";
 @import "./functions";
-@import "./colors";
-@import "./motion";
 @import "~bootstrap/scss/variables";
 @import "~bootstrap/scss/mixins";
+@import "./motion";
 
-// Removing colors we do not have maps for or need for
-// the OpenBMC theme. There are some that are required by
-// Bootstrap keys that cannot be removed from theme colors
-// are primary, success, and danger.
-// https://getbootstrap.com/docs/4.0/getting-started/theming/#required-keys
-$grays: map-remove($grays, "500");
-$colors: map-remove($colors, "indigo", "purple", "pink", "orange", "cyan");
-$colors: map-remove($theme-colors, "light", "dark");
-
-// Optional
 @import "~bootstrap/scss/root";
 @import "~bootstrap/scss/reboot";
 @import "~bootstrap/scss/alert";