autonomic-cooperative/autonomic-block-theme
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

nav-menu: improve mobile screen styling
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
desmukh
2023-08-08 18:40:58 +05:00
parent 628c393fa1
commit 910889fb41
2 changed files with 63 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
style.css
View File

@ -91,4 +91,62 @@ html, body {
.wp-site-blocks .footer {
height: 100%;
}
.nav-menu {
display: flex;
justify-content: space-between;
align-items: center;
}
.logo-wrapper {
width: 32px;
}
.wp-site-blocks .wp-block-group:nth-child(1) .nav-menu {
padding-top: 0 !important;
}
.wp-site-blocks .wp-block-group:nth-child(1) .logo-wrapper {
padding-top: 0 !important;
}
@media screen and (max-width: 782px){
.nav-menu {
padding-left: 1rem;
padding-right: 1rem;
}
.wp-site-blocks .wp-block-group:nth-child(1) {
padding-top: 24px !important;
}
}
@media screen and (min-width: 600px){
.nav-menu .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
display: none;
}
.nav-menu .wp-block-navigation__responsive-container-open:not(.always-shown) {
display: inherit;
}
}
@media screen and (min-width: 782px){
.nav-menu {
display: block;
padding-right: 30%;
}
.nav-menu .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
display: block;
}
.nav-menu .wp-block-navigation__responsive-container-open:not(.always-shown) {
display: none;
}
.logo-wrapper {
padding-bottom: 88px;
width: inherit;
}
}