From ed5bb517266c80904c44bf44a335f1003f5aa277 Mon Sep 17 00:00:00 2001 From: Kim <1877318+kimsible@users.noreply.github.com> Date: Thu, 23 Jul 2020 15:09:15 +0200 Subject: 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 --- .../app/shared/shared-main/misc/top-menu-dropdown.component.scss | 6 ++++++ 1 file changed, 6 insertions(+) (limited to 'client/src/app/shared/shared-main/misc/top-menu-dropdown.component.scss') diff --git a/client/src/app/shared/shared-main/misc/top-menu-dropdown.component.scss b/client/src/app/shared/shared-main/misc/top-menu-dropdown.component.scss index 84dd7dce3..655c38489 100644 --- a/client/src/app/shared/shared-main/misc/top-menu-dropdown.component.scss +++ b/client/src/app/shared/shared-main/misc/top-menu-dropdown.component.scss @@ -1,6 +1,12 @@ @import '_variables'; @import '_mixins'; +:host { + display: block; + height: $sub-menu-height; + margin-bottom: $sub-menu-margin-bottom; +} + .parent-entry { span[role=button] { cursor: pointer; -- cgit v1.2.3