Andreas/ngx-admin
1
0
Fork 0
mirror of https://github.com/akveo/ngx-admin.git synced 2026-02-25 01:14:06 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(sidebar): hide on mobile when navigation is complete

Browse source
This commit is contained in:
Dmitry Nehaychik 2017-09-19 21:00:24 +03:00
parent 5839bdd3cf
commit d5db2d0614
6 changed files with 255 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

67
src/app/@theme/layouts/two-columns/two-columns.layout.scss
View file

@ -1,11 +1,48 @@
@import '../../styles/themes';
@import '~bootstrap/scss/mixins/breakpoints';
@import '~@nebular/theme/styles/global/bootstrap/breakpoints';
@include nb-install-component() {
nb-layout-column.small {
flex: 0.15 !important;
}
nb-sidebar.settings-sidebar {
$sidebar-width: 7.5rem;
transition: width 0.3s ease;
width: $sidebar-width;
overflow: hidden;
&.collapsed {
width: 0;
/deep/ .main-container {
width: 0;
.scrollable {
width: $sidebar-width;
padding: 1.25rem;
}
}
}
/deep/ .main-container {
width: $sidebar-width;
background: nb-theme(color-bg);
transition: width 0.3s ease;
overflow: hidden;
.scrollable {
width: $sidebar-width;
}
@include nb-for-theme(cosmic) {
background: nb-theme(layout-bg);
}
}
}
nb-sidebar.menu-sidebar {
margin-top: nb-theme(sidebar-header-gap);
@ -62,4 +99,32 @@
}
}
}
@include media-breakpoint-down(xs) {
.main-content {
padding: 0.75rem !important;
}
}
@include media-breakpoint-down(sm) {
nb-sidebar.menu-sidebar {
margin-top: 0;
/deep/ .main-container {
height: calc(#{nb-theme(sidebar-height)} - #{nb-theme(header-height)}) !important;
border-top-right-radius: 0;
.scrollable {
padding-top: 0;
}
}
}
.main-btn {
display: none;
}
}
}