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

fix(header): header responsive

Browse source
This commit is contained in:
Mikhail Hryb 2017-09-11 11:44:04 +03:00 • committed by KostyaDanovsky
parent 5f30c69416
commit 56c1ea5628
2 changed files with 66 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

50
src/app/@theme/components/header/header.component.scss
View file

@ -1,5 +1,7 @@
@import '../../styles/themes';
@import '~@nebular/theme/styles/global/bootstrap/hero-buttons';
@import '~bootstrap/scss/mixins/breakpoints';
@import '~@nebular/theme/styles/global/bootstrap/breakpoints';
@include nb-install-component() {
display: flex;
@ -7,6 +9,8 @@
width: 100%;
.left {
display: flex;
width: 100%;
order: 0;
flex-direction: row;
}
@ -15,9 +19,26 @@
flex-direction: row-reverse;
}
.logo-containter {
display: flex;
align-items: center;
}
.switcher-container {
display: flex;
flex-direction: column;
align-items: center;
width: 50%;
}
.action-item {
display: block;
}
.header-container {
display: flex;
align-items: center;
width: 100%;
.navigation {
padding-right: nb-theme(padding);
@ -37,7 +58,6 @@
}
.theme-switch {
margin: 0 6rem;
width: 12rem;
display: flex;
justify-content: space-between;
@ -116,6 +136,7 @@
}
.toggle-layout /deep/ a {
display: block;
text-decoration: none;
line-height: 1;
@ -129,5 +150,32 @@
}
}
}
nb-user /deep/ .user-name {
display: block;
}
@include media-breakpoint-down(md) {
.action-item {
display: none;
}
}
@include media-breakpoint-down(sm) {
nb-user /deep/ .user-name {
display: none;
}
}
@include media-breakpoint-down(xs) {
.toggle-layout {
display: none;
}
.switcher-container {
display: none;
}
}
}