From 094e6bd6938adff50c3b9e4bde24f73d662b754a Mon Sep 17 00:00:00 2001 From: Brandon Green Date: Thu, 30 Jul 2020 11:02:04 -0400 Subject: [PATCH 1/7] wip hover dropdown instead of on click --- _includes/main_menu.html | 4 ++-- _sass/navigation.scss | 7 ++++--- 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/_includes/main_menu.html b/_includes/main_menu.html index cbd9f7934114..e563edf7be65 100644 --- a/_includes/main_menu.html +++ b/_includes/main_menu.html @@ -7,7 +7,7 @@
  • - + Ecosystem
    @@ -42,7 +42,7 @@
  • - + Resources
    diff --git a/_sass/navigation.scss b/_sass/navigation.scss index 61eb26cf33bf..14e37bd6dc9c 100644 --- a/_sass/navigation.scss +++ b/_sass/navigation.scss @@ -295,9 +295,10 @@ border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 0.25rem; } - -.ecosystem-dropdown-menu.show-menu, .resources-dropdown-menu.show-menu { - display: block; +.ecosystem-dropdown:hover { + .ecosystem-dropdown-menu { + display: block; + } } .main-menu ul li { From 1a05d08e69cf2ad15ba6db52cb9002b3ee354334 Mon Sep 17 00:00:00 2001 From: Brandon Green Date: Wed, 5 Aug 2020 15:39:34 -0400 Subject: [PATCH 2/7] Change dropdown to hover --- _sass/navigation.scss | 6 ++---- assets/main-menu-dropdown.js | 4 ++-- 2 files changed, 4 insertions(+), 6 deletions(-) diff --git a/_sass/navigation.scss b/_sass/navigation.scss index 14e37bd6dc9c..a5d1848b9837 100644 --- a/_sass/navigation.scss +++ b/_sass/navigation.scss @@ -279,13 +279,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; @@ -295,8 +293,8 @@ border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 0.25rem; } -.ecosystem-dropdown:hover { - .ecosystem-dropdown-menu { +.ecosystem-dropdown:hover, .resources-dropdown:hover { + .ecosystem-dropdown-menu, .resources-dropdown-menu { display: block; } } diff --git a/assets/main-menu-dropdown.js b/assets/main-menu-dropdown.js index 441456811c53..15184bc478f8 100644 --- a/assets/main-menu-dropdown.js +++ b/assets/main-menu-dropdown.js @@ -1,8 +1,8 @@ -$("[data-toggle='ecosystem-dropdown']").on("click", function() { +$("[data-toggle='ecosystem-dropdown']").hover(function() { toggleDropdown($(this).attr("data-toggle")); }); -$("[data-toggle='resources-dropdown']").on("click", function() { +$("[data-toggle='resources-dropdown']").hover(function() { toggleDropdown($(this).attr("data-toggle")); }); From 5768c1eb08ece612a7a8564e6f2107c5a11a227d Mon Sep 17 00:00:00 2001 From: Brandon Green Date: Wed, 5 Aug 2020 15:51:23 -0400 Subject: [PATCH 3/7] add space --- _sass/navigation.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/_sass/navigation.scss b/_sass/navigation.scss index a5d1848b9837..657e0174ac48 100644 --- a/_sass/navigation.scss +++ b/_sass/navigation.scss @@ -293,6 +293,7 @@ border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 0.25rem; } + .ecosystem-dropdown:hover, .resources-dropdown:hover { .ecosystem-dropdown-menu, .resources-dropdown-menu { display: block; From b79bdfa268e6b870defc3de589fc3bde2528f0ca Mon Sep 17 00:00:00 2001 From: Brandon Green Date: Wed, 5 Aug 2020 15:55:03 -0400 Subject: [PATCH 4/7] re-add data toggles --- _includes/main_menu.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/_includes/main_menu.html b/_includes/main_menu.html index e563edf7be65..cbd9f7934114 100644 --- a/_includes/main_menu.html +++ b/_includes/main_menu.html @@ -7,7 +7,7 @@
  • - + Ecosystem
    @@ -42,7 +42,7 @@
  • - + Resources
    From dee53020feb7f7afc81e34a4900e51156453ae9d Mon Sep 17 00:00:00 2001 From: Brandon Green Date: Wed, 5 Aug 2020 15:57:19 -0400 Subject: [PATCH 5/7] Changed dropdown to work with show menu class --- _sass/navigation.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/_sass/navigation.scss b/_sass/navigation.scss index 657e0174ac48..d8312df788c4 100644 --- a/_sass/navigation.scss +++ b/_sass/navigation.scss @@ -294,7 +294,7 @@ border-radius: 0.25rem; } -.ecosystem-dropdown:hover, .resources-dropdown:hover { +.ecosystem-dropdown.show-menu, .resources-dropdown.show-menu { .ecosystem-dropdown-menu, .resources-dropdown-menu { display: block; } From b54a2253cda22c272c3ce65416629130c01a10a7 Mon Sep 17 00:00:00 2001 From: Brandon Green Date: Wed, 5 Aug 2020 16:27:59 -0400 Subject: [PATCH 6/7] Fix hover syntax error and remove data toggle --- _includes/main_menu.html | 4 ++-- _sass/navigation.scss | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/_includes/main_menu.html b/_includes/main_menu.html index cbd9f7934114..e563edf7be65 100644 --- a/_includes/main_menu.html +++ b/_includes/main_menu.html @@ -7,7 +7,7 @@
  • - + Ecosystem
    @@ -42,7 +42,7 @@
  • - + Resources
    diff --git a/_sass/navigation.scss b/_sass/navigation.scss index d8312df788c4..657e0174ac48 100644 --- a/_sass/navigation.scss +++ b/_sass/navigation.scss @@ -294,7 +294,7 @@ border-radius: 0.25rem; } -.ecosystem-dropdown.show-menu, .resources-dropdown.show-menu { +.ecosystem-dropdown:hover, .resources-dropdown:hover { .ecosystem-dropdown-menu, .resources-dropdown-menu { display: block; } From 5d7d623c09295c22c6d8899091bcc724480df769 Mon Sep 17 00:00:00 2001 From: Brandon Green Date: Wed, 5 Aug 2020 16:45:37 -0400 Subject: [PATCH 7/7] update arrow size to account for updated nav font size --- _sass/navigation.scss | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/_sass/navigation.scss b/_sass/navigation.scss index 31b28d786bdc..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 {