entrouvert
/
publik-base-theme
15
1
Fork 1
Code Issues Pull Requests 9 Releases Wiki Activity

alpes-maritimes-2022: change styles of PWA nav (#72239)

This commit is contained in:
Thomas Jund 2023-01-25 15:35:53 +01:00 committed by Gitea
parent 49448dcb66
commit 56fb3379a1
2 changed files with 38 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
static/alpes-maritimes-2022/_custom.scss
View File

@ -1030,24 +1030,42 @@ span.required {
//
.pwa-navigation {
div > ul li {
&:not(:last-child) {
border-right: 1px dashed $primary-color;
}
a {
background-size: auto 25px;
padding-top: 35px;
display: flex;
align-items: center;
justify-content: center;
span {
height: auto;
font-size: $fz-small;
div > ul {
padding-top: 6px;
border-top: 2px solid #D1D1D1;
li {
&:not(:last-child) {
border-right: 1px dashed $primary-color;
}
&.selected {
font-weight: bold;
position: relative;
&::before {
content: "";
display: block;
position: absolute;
height: 4px;
width: 80%;
margin: 0 auto;
top: 0;
left: 0;
right: 0;
background-color: $primary-color;
transform: translateY(-8px);
}
}
a {
background-size: auto 25px;
background-position: 50% 5px;
padding-top: 30px;
display: flex;
align-items: center;
justify-content: center;
span {
height: auto;
font-size: $fz-small;
}
}
}
&.selected a,
a:hover {
background-blend-mode: color-dodge;
}
}
}

8
static/alpes-maritimes-2022/_vars.scss
View File

@ -71,11 +71,9 @@ $nav-button-background: $primary-color;
$nav-button-color: white;
$nav-mobile-bottom-bar-background: $gray-xlight;
$nav-mobile-bottom-bar-color: $primary-color;
$nav-mobile-bottom-bar-item-hover-background: $primary-color;
$nav-mobile-bottom-bar-item-hover-color: white;
$nav-mobile-bottom-bar-item-selected-background: $nav-mobile-bottom-bar-item-hover-background;
$nav-mobile-bottom-bar-item-selected-color: $nav-mobile-bottom-bar-item-hover-color;
$nav-mobile-bottom-bar-color: $font-color;
$nav-mobile-bottom-bar-item-hover-background: white;
$nav-mobile-bottom-bar-item-selected-color: $primary-color;
$title-transform: uppercase;
$title-background: transparent;