AdminLTE/scss/layout/_layout-mobile.scss

66 lines
1.2 KiB
SCSS
Raw Normal View History

2021-05-13 01:17:47 +00:00
@include media-breakpoint-down(md) {
.wrapper {
grid-template-areas:
"main-sidebar main-brand main-header"
"main-sidebar content-wrapper main-header"
"main-sidebar main-footer main-header";
2021-05-13 20:30:52 +00:00
grid-template-columns: auto 1fr auto;
2021-05-13 01:17:47 +00:00
.main-sidebar {
position: fixed;
top: 0;
bottom: 0;
margin-left: -#{$sidebar-width};
min-height: 100vh;
.sidebar {
overflow-x: hidden;
overflow-y: auto;
}
}
.main-header {
2021-05-13 20:30:52 +00:00
position: fixed;
top: 0;
bottom: 0;
min-height: 100vh;
z-index: $zindex-header-mobile;
width: $sidebar-width;
margin-left: -#{$sidebar-width};
align-items: baseline;
@include transition($sidebar-transition);
.navbar-nav {
flex-direction: column;
}
.sidebar-full-icon {
display: none;
}
2021-05-13 01:17:47 +00:00
}
.brand-link {
animation: none;
}
.sidebar-full-icon,
.header-full-icon {
display: block;
}
}
.sidebar-open {
.main-sidebar {
margin-left: 0;
}
}
2021-05-13 20:30:52 +00:00
@include media-breakpoint-down(md) {
.header-mobile-open {
.main-header {
margin-left: 0;
}
}
}
2021-05-13 01:17:47 +00:00
}