khnav/css/khnav_mobile.css

117 lines
No EOL
1.7 KiB
CSS

/* Feuille css, partie "moins de 900px de large" pour la barre générale de
Khaganat et son footer. */
@media screen and (max-width: 900px) {
.khnav_sticky {
position:sticky;
top:0;
z-index: 999;
height:3em;
}
.khnav_mobile {
display:flex;
width: 100%;
justify-content: space-between;
align-items: flex-start;
/*position:sticky;*/
top:0;
z-index: 999;
height:3em;
}
.khnav_logo {
display:none;
}
.khnav_mobile_square {
height:100%;
background-color:bisque;
display: flex;
}
.khnav_mobile > a {
height:100%;
}
.khnav_logo_mobile {
max-width: 2em;
margin: 0;
padding:0.5em;
vertical-align: inherit;
background-color: #8530bf;
}
.khnav_mobile_square label,
.khnav_open_menu, khnav_close_menu {
height:100%;
display: flex;
}
/* Pour afficher le menu au clic sur le bouton
"~" sélectionne tous les "nav ul" suivant
cf https://developer.mozilla.org/fr/docs/Web/CSS/Sélecteurs_CSS#Les_combinateurs
*/
.khnav_input_mobile[type=checkbox]:checked ~ nav ul {
display:flex;
}
.khnav_input_mobile[type=checkbox]:checked ~ nav {
border-bottom: 0.5em solid #8530bf !important ;
}
.khnav_gen {
flex-flow : column wrap;
border:none;
overflow: auto;
max-height: 80vh;
display:block;
}
.khnav_gen ul {
display: none;
flex-flow : column wrap;
width:100%;
background: #8530bf;
padding-left: 0;
color:white;
padding:0;
}
.khnav_dropdown ul {
display: flex;
position: relative;
clip: initial;
clip-path: initial;
}
.khnav_dropdown-toggle {
}
.khnav_fleche {
display: none;
}
.khnav_dropdown-menu li a:hover aside {
display: none;
}
.khnav_connect {
}
/* Pied de page */
.khfooter::before {
display: none;
}
.khfooter::after {
display: none;
}
.khfooter div {
flex-flow: row wrap;
justify-content: center;
}
}