diff --git a/_sass/navigation.scss b/_sass/navigation.scss index 75e33a3f230e..4b1198c76213 100644 --- a/_sass/navigation.scss +++ b/_sass/navigation.scss @@ -247,8 +247,8 @@ padding-right: rem(32px); position: relative; background-image: url($baseurl + "/assets/images/chevron-right-white.svg"); - background-size: 7px 12px; - background-position: top 7px right 15px; + background-size: 7px 18px; + background-position: top 6px right 15px; background-repeat: no-repeat; &:hover { background-image: url($baseurl + "/assets/images/chevron-right-orange.svg"); @@ -259,7 +259,7 @@ padding-right: rem(32px); position: relative; background-image: url($baseurl + "/assets/images/chevron-down-white.svg"); - background-size: 13px 13px; + background-size: 14px 18px; background-position: top 7px right 10px; background-repeat: no-repeat; &:hover { @@ -305,13 +305,11 @@ width: 226px; display: none; position: absolute; - top: rem(50px); z-index: 1000; display: none; float: left; min-width: 10rem; padding: 0.5rem 0; - margin: 0.125rem 0 0; font-size: 1rem; color: #212529; text-align: left; @@ -322,8 +320,10 @@ border-radius: 0.25rem; } -.ecosystem-dropdown-menu.show-menu, .resources-dropdown-menu.show-menu { - display: block; +.ecosystem-dropdown:hover, .resources-dropdown:hover { + .ecosystem-dropdown-menu, .resources-dropdown-menu { + display: block; + } } .main-menu ul li { diff --git a/assets/main-menu-dropdown.js b/assets/main-menu-dropdown.js index 0ee2ea1fce58..2e1a8733c12e 100644 --- a/assets/main-menu-dropdown.js +++ b/assets/main-menu-dropdown.js @@ -1,9 +1,9 @@ -$("[data-toggle='ecosystem-dropdown']").on("click", function() { +$("[data-toggle='ecosystem-dropdown']").hover(function() { toggleDropdown($(this).attr("data-toggle")); toggleArrowClass(".ecosystem-option"); }); -$("[data-toggle='resources-dropdown']").on("click", function() { +$("[data-toggle='resources-dropdown']").hover(function() { toggleDropdown($(this).attr("data-toggle")); toggleArrowClass(".resource-option"); });