make priamry navigation even more responsive to account for more menus
@@ -505,10 +505,10 @@ a {
display: flex;
flex-wrap: wrap;
justify-content: center;
- padding-top: 8px;
+ padding-top: 4px;
}
.account-nav-container .max-width-container > * {
- margin-bottom: 8px;
+ margin-bottom: 4px;
}
.account-nav-container strong {
font-weight: normal;
@@ -699,7 +699,6 @@ a {
.js .primary-site-nav .dropdown-menu {
background: #619B96;
display: none;
- min-width: 100px;
padding: 0 20px 10px;
}
.js .primary-site-nav .dropdown-menu li {
@@ -717,16 +716,21 @@ a {
.js .primary-site-nav {
border: none;
display: block !important;
- height: 40px;
+ height: auto;
overflow: visible;
}
.js .nav-primary-list {
display: flex;
+ flex-wrap: wrap;
justify-content: center;
+ padding: 4px 0;
}
.js .primary-site-nav .nav-primary-link {
border: none;
- padding: 0 10px;
+ height: auto;
+ line-height: 1.4;
+ padding: 4px 10px;
+ white-space: nowrap;
}
.js .primary-site-nav .has-dropdown .nav-primary-link.open {
background: #619B96;
@@ -738,6 +742,9 @@ a {
background: #619B96;
padding: 8px 0;
position: absolute;
+ left: 0;
+ width: 200px;
+ z-index: 2;
}
.js .primary-site-nav .has-dropdown:last-of-type .dropdown-menu {
right: 0;
@@ -749,10 +756,10 @@ a {
.js .primary-site-nav .dropdown-menu li a {
align-items: center;
display: flex;
- height: 30px;
+ height: auto;
+ line-height: 1.25;
text-decoration: none;
- white-space: nowrap;
- padding: 0 15px 4px;
+ padding: 4px 15px 6px;
}
.js .primary-site-nav .dropdown-menu li a:hover {
background: #78ACA8;
