scss: introduce $pwa-nav-limit (#61440)

This commit is contained in:
Thomas Jund 2022-02-04 14:55:02 +01:00
parent 071df22ae2
commit b98c879f7d
2 changed files with 11 additions and 12 deletions

View File

@ -437,6 +437,11 @@ paramètre, la deuxième sa description et la troisième la valeur par défaut.
<td><p>Couleur du texte du badge reprenant le nombre de notifications.</p></td>
<td><p>white</p></td>
</tr>
<tr>
<td><p><code>$pwa-nav-limit</code></p></td>
<td><p>Largeur sous laquelle la navigation PWA est visible</p></td>
<td><p>$mobile-limit</p></td>
</tr>
</table>
</section>

View File

@ -44,6 +44,7 @@ $nav-mobile-bottom-bar-item-hover-background: $nav-item-hover-background !defaul
$nav-mobile-bottom-bar-item-hover-color: $nav-item-hover-color !default;
$nav-mobile-bottom-bar-item-selected-background: $nav-item-selected-background !default;
$nav-mobile-bottom-bar-item-selected-color: $nav-item-selected-color !default;
$pwa-nav-limit: $nav-mobile-limit !default;
$nav-mobile-bottom-bar-badge-color: white !default;
$nav-mobile-bottom-bar-badge-background: #e22 !default;
@ -364,16 +365,6 @@ div.menucell {
}
}
.pwa-navigation {
display: none;
}
@media screen and (max-width: $nav-mobile-limit) {
.pwa-navigation {
display: block;
}
}
@mixin pwa-bottom-bar {
background: $nav-mobile-bottom-bar-background;
position: fixed;
@ -447,15 +438,18 @@ div.menucell {
.pwa-navigation {
@include pwa-bottom-bar;
display: none;
}
@media screen and (max-width: $nav-mobile-limit) {
@media screen and (max-width: $pwa-nav-limit) {
.pwa-navigation {
display: block;
}
.has-pwa-navigation footer {
margin-bottom: $nav-mobile-bottom-bar-height;
}
}
@if $nav-mobile-mode == bottom-bar {
@media screen and (max-width: $nav-mobile-limit) {
.site-nav {