[camel-website] branch master updated: fix: top level navigation dropdown positioning

[zregvart]

This is an automated email from the ASF dual-hosted git repository.

zregvart pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/camel-website.git


The following commit(s) were added to refs/heads/master by this push:
     new b2b4605  fix: top level navigation dropdown positioning
b2b4605 is described below

commit b2b46059c45e7a4f1b74d41ed36f93d0e5e71676
Author: Zoran Regvart <zregv...@apache.org>
AuthorDate: Thu Apr 2 12:52:03 2020 +0200

    fix: top level navigation dropdown positioning
    
    This fixes the positioning of the top level navigation dropdown making
    it look seamless with the menu item. Also simplifies the CSS by removing
    duplication.
---
 antora-ui-camel/src/css/header.css | 34 +++++++++++-----------------------
 1 file changed, 11 insertions(+), 23 deletions(-)

diff --git a/antora-ui-camel/src/css/header.css 
b/antora-ui-camel/src/css/header.css
index 38e434a..91ff33b 100644
--- a/antora-ui-camel/src/css/header.css
+++ b/antora-ui-camel/src/css/header.css
@@ -134,6 +134,17 @@ body {
   display: block;
 }
 
+.navbar-dropdown {
+  position: absolute;
+  display: none;
+  top: calc(100% - 1px);
+  background-color: var(--navbar-menu-background);
+  border: 1px solid var(--navbar-menu-border-color);
+  border-top: none;
+  border-radius: 0 0 0.25rem 0.25rem;
+  left: 0;
+}
+
 .navbar-dropdown .navbar-item {
   font-weight: normal;
 }
@@ -159,13 +170,6 @@ body {
     padding: 1rem 2rem;
   }
 
-  .navbar-dropdown {
-    background-color: var(--navbar-menu-background);
-    top: 100%;
-    left: 0;
-    min-width: 100%;
-  }
-
   .has-dropdown:not(.is-active) > .navbar-dropdown {
     display: none;
   }
@@ -234,11 +238,7 @@ body {
   }
 
   .navbar-dropdown {
-    background-color: var(--navbar-menu-background);
     display: none;
-    top: 100%;
-    left: 0;
-    min-width: 100%;
   }
 
   .has-dropdown:not(.is-active) > .navbar-dropdown {
@@ -351,18 +351,6 @@ body {
     margin-left: auto;
   }
 
-  .navbar-dropdown {
-    background-color: var(--navbar-menu-background);
-    border: 1px solid var(--navbar-menu-border-color);
-    border-top: none;
-    border-radius: 0 0 0.25rem 0.25rem;
-    display: none;
-    top: 100%;
-    left: 0;
-    min-width: 100%;
-    position: absolute;
-  }
-
   .navbar-dropdown .navbar-item {
     white-space: nowrap;
   }