arles-2020: refactor pwa menu (#40677)

This commit is contained in:
Serghei Mihai 2020-03-17 14:14:25 +01:00
parent d147099e43
commit 3bdfd0fecf
2 changed files with 17 additions and 40 deletions

View File

@ -49,47 +49,20 @@ div.gru-nav .gru-nav-button {
}
}
@media screen and ($min-desktop-viewport) {
#pwa-navigation {
display: block;
max-width: $width;
margin: auto;
position: relative;
height: auto;
> div {
background: $nav-mobile-bottom-bar-background;
position: absolute;
left: 0;
top: #{0px - $header-height};
}
ul li {
margin: 0;
a {
padding-left: 15px;
padding-right: 15px;
background-position: 15px 50%;
padding-top: 0;
span {
text-align: left;
padding-left: 35px;
font-size: 15px;
}
span.badge {
padding: 0;
height: 20px;
width: 20px;
text-align: center;
left: 30px;
}
&:hover {
background-color:#03386a;
}
#pwa-navigation {
border-top: 1px solid #ddd;
ul li {
margin: 0;
a {
padding-top: 0;
span {
font-size: 85%;
}
span.badge {
font-size: 75%;
}
}
}
.pwa-navigation ~ footer {
margin-bottom: 0;
}
}

View File

@ -19,8 +19,12 @@ $nav-button-background: white;
$nav-button-color: $primary-color;
$nav-active-color: $primary-color;
$nav-mobile-bottom-bar-background: $primary-color;
$nav-mobile-bottom-bar-color: #eaeaea;
$nav-mobile-bottom-bar-background: #ffffff;
$nav-mobile-bottom-bar-item-hover-background: #f4f4f4;
$nav-mobile-bottom-bar-item-selected-background: #f4f4f4;
$nav-mobile-bottom-bar-item-selected-color: $primary-color;
$nav-mobile-bottom-bar-item-hover-color: $primary-color;
$nav-mobile-bottom-bar-color: $primary-color;
$nav-mobile-bottom-bar-height: 60px;
$nav-mobile-menu-background: $lighter-primary-color;