Improve navigation sub-menu and tabs effects (#2971)

* Improve nav border and colors on active and non-active

* Remove margin-top effect on active nav

* Use opacity / bold instead of color change on nav

* Remove dropdown items label in sub-menu and add a class active

* Position sub-menu to fixed

* Autoclose dropdown sub-menu only on outside click

* Remove open dropdown on hover in sub-menu

* Show reusable h1 for dropdown item in sub-menu

* Put reusable sub-menu h1 styles to mixins

* Add icons to sub-menu dropdown-item h1

* Make all the sub-menu accessible with focus

Co-authored-by: kimsible <kimsible@users.noreply.github.com>

1 files changed, 5 insertions, 0 deletions

diff --git a/client/src/app/+admin/admin.component.scss b/client/src/app/+admin/admin.component.scss
index ef8965c3f..61a2744ba 100644
--- a/client/src/app/+admin/admin.component.scss
+++ b/client/src/app/+admin/admin.component.scss
@@ -1,3 +1,8 @@
+@import '_variables';
+@import '_mixins';
+
 my-top-menu-dropdown {
   flex-grow: 1;
 }
+
+@include sub-menu-h1;