Hi folks,
how to prevent the responsive design especially 'display:none' for the sidebar?
Used version: Metronic 8.1.6 / HTML
Cheers
Hi guys,
I was able to 'fix' the sidebar with the option data-kt-drawer="false"
This is not documented?
But know I have the problem, that the content slides under the sidebar (This can be reproduced with the official demos).
What to do here?
Hi,
May I know which Metronic demo are you referring and how to reproduce that bug ?
Do you want to disable responsiveness for the entire layout and content? To do so you can refer to this site and change the meta code to disable the responsive mode.
Regards.
Sure, I'm using demo 36.
For reproducing I used the demo36 standard index.html and changed the following css (from display:none):@media (max-width: 991.98px)
.app-sidebar {
display:flex;
Is this the wrong way? Could you tell me the correct one how to make the sidebar permanently visible and prevent the 'content sliding' for the mobile view?
Any help is much appreciated.
Hi,
Please follow the below steps:
1) Remove data-kt-drawer="true"
attribute from the sidebar
2) Add d-flex
class to the sidebar element.
3) Go to src/sass/layout/_sidebar.scss
and add below code:
.app-main,
.app-toolbar {
margin-left: $app-sidebar-base-width !important;
}
Sorry for that late answer.
I did as you said. But instead of a recompiling (I'm using, the html files only) I added the following to the style.bundle.css:
.app-main,
.app-toolbar {
margin-left: 225px !important;
}
data-kt-drawer-width="225px"
to kt_app_sidebar
.Hi,
Please try to recompile it as the code I provided works for sass, not for CSS.
Installing the build tools and running the gulp task may take you about 10 mins as explained here.
Regards.