Vaczkor
asked 6 years ago

Hi guys!
I really like your themes but i wanted to make some custom changes in it to look a bit more minimal.
I noticed it is a responsive theme, and a left sidebar navigation is hidden in this case. Could you tell me how can I set as default setting? Meaning the left sidebar navigation is always hidden, it oly apperas if you click on the open icen.
Thank you in advence!
Dan

1 Answers
Kido D
answered 6 years ago

Hi Dan,  
To hide the sidebar by default, please go to Dashboard / Appearance / Customize / Custom Code, and add the code below to Header Code section:

<style>
.container {padding: 0 40px !important;}
@media (max-width: 767px){
.container {padding: 0 20px !important;}
#page>.container{padding: 0 !important;}
}
@media (min-width: 768px) {
#page {margin-left: 0;}
}
@media (min-width: 1200px) {
#page {padding: 0px 40px 0;}
}
@media (min-width: 1200px) {
.site-main,.site-main-inner {margin-left: 0;}
.show-site-nav {display: block;}
#page {padding:0;}
}
@media ( min-width: 768px ) and ( max-width: 9999px ) {
.site-nav {left: 40px;}
.site-nav-inner {padding-top: 80px;padding-bottom: 40px;}
.site-main {padding: 80px 0 0;}
}
@media ( max-width: 9999px ) {
.site-nav {position: fixed;top: 0;}
.show-nav .site-nav {position: absolute;}
.admin-bar .site-nav {top: 28px;}
.site-main {background: #fff;position: relative;}
.site-nav {width: 240px;border-right: 1px solid #ddd;display: none;-webkit-box-sizing:border-box;box-sizing:border-box;}
.site-main,.site-footer {-webkit-transform: translateX(0);-moz-transform: translateX(0);-ms-transform: translateX(0);-o-transform: translateX(0);transform: translateX(0);-webkit-transition: -webkit-transform 500ms;-moz-transition: -moz-transform 500ms;-o-transition: -o-transform 500ms;transition: transform 500ms;-webkit-backface-visibility: hidden;-moz-backface-visibility: hidden;backface-visibility: hidden;}
.show-nav .site-nav{background:#fff;}
.show-nav .site-main, .show-nav .site-footer {position: fixed;border-left: 1px solid #ddd;overflow: hidden;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;-webkit-transform: translateX(239px);-moz-transform: translateX(239px);-ms-transform: translateX(239px);-o-transform: translateX(239px);transform: translateX(239px);width: 100%;}
.show-nav .site-footer {opacity: 0;}
}
</style>

  Hope that helps!

Powered by DW Question & Answer Pro