(Navbar) Added classes to the navbar containing fuse-sidebar's to contain their custom styles

This commit is contained in:
Sercan Yemen 2018-07-12 09:25:56 +03:00
parent 0cd5d613e0
commit 25a6ca2684
6 changed files with 59 additions and 53 deletions

View File

@ -1,60 +1,63 @@
@import "src/@fuse/scss/fuse";
fuse-sidebar {
overflow: hidden;
&.folded:not(.unfolded) {
&.navbar-fuse-sidebar {
overflow: hidden;
navbar {
&.folded:not(.unfolded) {
navbar-vertical-style-1 {
navbar {
.navbar-top {
padding: 12px 0;
justify-content: center;
navbar-vertical-style-1 {
.buttons {
display: none;
}
.navbar-top {
padding: 12px 0;
justify-content: center;
.logo {
.logo-icon {
width: 32px;
height: 32px;
}
.logo-text {
.buttons {
display: none;
}
.logo {
.logo-icon {
width: 32px;
height: 32px;
}
.logo-text {
display: none;
}
}
}
}
.navbar-scroll-container {
.navbar-scroll-container {
.user {
padding: 12px 0;
.user {
padding: 12px 0;
.avatar-container {
position: relative;
top: auto;
padding: 0;
.avatar-container {
position: relative;
top: auto;
padding: 0;
.avatar {
width: 40px;
height: 40px;
.avatar {
width: 40px;
height: 40px;
}
}
.username,
.email {
display: none;
}
}
.username,
.email {
display: none;
.navbar-content {
margin-top: 0;
}
}
.navbar-content {
margin-top: 0;
}
}
}
}

View File

@ -1,22 +1,25 @@
@import "src/@fuse/scss/fuse";
fuse-sidebar {
overflow: hidden;
&.folded:not(.unfolded) {
&.navbar-fuse-sidebar {
overflow: hidden;
navbar {
&.folded:not(.unfolded) {
navbar-vertical-style-2 {
navbar {
.navbar-header {
padding: 0 13px;
navbar-vertical-style-2 {
.logo {
.navbar-header {
padding: 0 13px;
.logo-text {
opacity: 0;
transition: opacity 200ms ease;
.logo {
.logo-text {
opacity: 0;
transition: opacity 200ms ease;
}
}
}
}

View File

@ -99,7 +99,7 @@
<!-- LEFT NAVBAR -->
<ng-template #leftNavbar>
<fuse-sidebar name="navbar"
<fuse-sidebar name="navbar" class="navbar-fuse-sidebar"
[folded]="fuseConfig.layout.navbar.folded"
*ngIf="!fuseConfig.layout.navbar.hidden">
<navbar [variant]="fuseConfig.layout.navbar.variant"

View File

@ -101,7 +101,7 @@
<!-- LEFT NAVBAR -->
<ng-template #leftNavbar>
<fuse-sidebar name="navbar"
<fuse-sidebar name="navbar" class="navbar-fuse-sidebar"
[folded]="fuseConfig.layout.navbar.folded"
lockedOpen="gt-md"
*ngIf="!fuseConfig.layout.navbar.hidden">
@ -113,7 +113,7 @@
<!-- RIGHT NAVBAR -->
<ng-template #rightNavbar>
<fuse-sidebar name="navbar" position="right"
<fuse-sidebar name="navbar" position="right" class="navbar-fuse-sidebar"
[folded]="fuseConfig.layout.navbar.folded"
lockedOpen="gt-md"
*ngIf="!fuseConfig.layout.navbar.hidden">

View File

@ -101,7 +101,7 @@
<!-- LEFT NAVBAR -->
<ng-template #leftNavbar>
<fuse-sidebar name="navbar"
<fuse-sidebar name="navbar" class="navbar-fuse-sidebar"
[folded]="fuseConfig.layout.navbar.folded"
lockedOpen="gt-md"
*ngIf="!fuseConfig.layout.navbar.hidden">
@ -113,7 +113,7 @@
<!-- RIGHT NAVBAR -->
<ng-template #rightNavbar>
<fuse-sidebar name="navbar" position="right"
<fuse-sidebar name="navbar" position="right" class="navbar-fuse-sidebar"
[folded]="fuseConfig.layout.navbar.folded"
lockedOpen="gt-md"
*ngIf="!fuseConfig.layout.navbar.hidden">

View File

@ -87,7 +87,7 @@
<!-- LEFT NAVBAR -->
<ng-template #leftNavbar>
<fuse-sidebar name="navbar"
<fuse-sidebar name="navbar" class="navbar-fuse-sidebar"
[folded]="fuseConfig.layout.navbar.folded"
lockedOpen="gt-md"
*ngIf="!fuseConfig.layout.navbar.hidden">
@ -99,7 +99,7 @@
<!-- RIGHT NAVBAR -->
<ng-template #rightNavbar>
<fuse-sidebar name="navbar" position="right"
<fuse-sidebar name="navbar" position="right" class="navbar-fuse-sidebar"
[folded]="fuseConfig.layout.navbar.folded"
lockedOpen="gt-md"
*ngIf="!fuseConfig.layout.navbar.hidden">