github
/
AdminLTE
mirror of https://github.com/ColorlibHQ/AdminLTE
1
0
Fork 0
Code Issues Releases Wiki Activity

fix invisible nav items if there is a second nav in content

pull/3867/head
REJack 2021-07-29 19:33:58 +02:00
parent 2c4d879d64
commit 52ff423787
4 changed files with 84 additions and 84 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
build/scss/_cards.scss
View File

@ -62,7 +62,7 @@
} }
} }
.nav.flex-column { .nav.flex-column:not(.nav-sidebar) {
> li { > li {
border-bottom: 1px solid $card-border-color; border-bottom: 1px solid $card-border-color;
margin: 0; margin: 0;

134
build/scss/_main-sidebar.scss
View File

@ -14,7 +14,6 @@
outline: none; outline: none;
} }
} }
} }
.sidebar { .sidebar {
@ -201,7 +200,7 @@
} }
} }
.sidebar-is-opening .nav-sidebar { .sidebar-is-opening .sidebar .nav-sidebar {
.nav-link p { .nav-link p {
animation-name: fadeIn; animation-name: fadeIn;
animation-duration: $transition-speed; animation-duration: $transition-speed;
@ -400,7 +399,7 @@
// Hover and active states // Hover and active states
&.menu-open > .nav-link, &.menu-open > .nav-link,
&:hover > .nav-link, &:hover > .nav-link,
> .nav-link:focus { > .nav-link:focus {
background-color: $sidebar-dark-hover-bg; background-color: $sidebar-dark-hover-bg;
color: $sidebar-dark-hover-color; color: $sidebar-dark-hover-color;
} }
@ -575,7 +574,7 @@
} }
} }
.sidebar-collapse &.nav-child-indent { .sidebar-collapse &.nav-child-indent .sidebar {
.nav-treeview { .nav-treeview {
.nav-icon { .nav-icon {
margin-left: .55rem; margin-left: .55rem;
@ -731,39 +730,38 @@
.nav-icon { .nav-icon {
@include transition(margin-left $transition-fn $transition-speed); @include transition(margin-left $transition-fn $transition-speed);
margin-left: .6rem; margin-left: .6rem;
} }
} }
} }
.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused &.nav-child-indent, .sidebar-mini.sidebar-collapse,
.sidebar-mini.sidebar-collapse .main-sidebar:hover &.nav-child-indent, .sidebar-mini-md.sidebar-collapse,
.sidebar-mini-md.sidebar-collapse .main-sidebar.sidebar-focused &.nav-child-indent, .sidebar-mini-xs.sidebar-collapse {
.sidebar-mini-md.sidebar-collapse .main-sidebar:hover &.nav-child-indent, .main-sidebar.sidebar-focused &.nav-child-indent,
.sidebar-mini-xs.sidebar-collapse .main-sidebar.sidebar-focused &.nav-child-indent, .main-sidebar:hover &.nav-child-indent {
.sidebar-mini-xs.sidebar-collapse .main-sidebar:hover &.nav-child-indent {
.nav-treeview {
padding-left: 1rem;
.nav-treeview {
padding-left: 2rem;
margin-left: -1rem;
}
}
}
.sidebar-mini.sidebar-collapse.text-sm .main-sidebar.sidebar-focused &.nav-child-indent,
.sidebar-mini.sidebar-collapse.text-sm .main-sidebar:hover &.nav-child-indent,
.sidebar-mini-md.sidebar-collapse.text-sm .main-sidebar.sidebar-focused &.nav-child-indent,
.sidebar-mini-md.sidebar-collapse.text-sm .main-sidebar:hover &.nav-child-indent,
.sidebar-mini-xs.sidebar-collapse.text-sm .main-sidebar.sidebar-focused &.nav-child-indent,
.sidebar-mini-xs.sidebar-collapse.text-sm .main-sidebar:hover &.nav-child-indent {
.nav-treeview {
padding-left: .5rem;
.nav-treeview { .nav-treeview {
padding-left: 1rem; padding-left: 1rem;
margin-left: -.5rem;
.nav-treeview {
padding-left: 2rem;
margin-left: -1rem;
}
}
}
}
.sidebar-mini.sidebar-collapse.text-sm,
.sidebar-mini-md.sidebar-collapse.text-sm,
.sidebar-mini-xs.sidebar-collapse.text-sm {
.main-sidebar.sidebar-focused &.nav-child-indent,
.main-sidebar:hover &.nav-child-indent {
.nav-treeview {
padding-left: .5rem;
.nav-treeview {
padding-left: 1rem;
margin-left: -.5rem;
}
} }
} }
} }
@ -771,40 +769,41 @@
.sidebar-mini.sidebar-collapse &, .sidebar-mini.sidebar-collapse &,
.sidebar-mini-md.sidebar-collapse &, .sidebar-mini-md.sidebar-collapse &,
.sidebar-mini-xs.sidebar-collapse & { .sidebar-mini-xs.sidebar-collapse & {
> .nav-item > .nav-link { .sidebar {
.nav-icon { > .nav-item > .nav-link {
margin-left: .55rem; .nav-icon {
} margin-left: .55rem;
}
&.active { &.active {
> .nav-icon{ > .nav-icon {
margin-left: .36rem; margin-left: .36rem;
}
} }
} }
} &.nav-child-indent {
&.nav-child-indent {
.nav-treeview {
.nav-treeview { .nav-treeview {
padding-left: 0; .nav-treeview {
margin-left: 0; padding-left: 0;
margin-left: 0;
}
} }
} }
} }
} }
.sidebar-mini.sidebar-collapse.text-sm &, .sidebar-mini.sidebar-collapse.text-sm &,
.sidebar-mini-md.sidebar-collapse.text-sm &, .sidebar-mini-md.sidebar-collapse.text-sm &,
.sidebar-mini-xs.sidebar-collapse.text-sm & { .sidebar-mini-xs.sidebar-collapse.text-sm & {
> .nav-item > .nav-link { .sidebar {
.nav-icon { > .nav-item > .nav-link {
margin-left: .75rem; .nav-icon {
} margin-left: .75rem;
}
&.active { &.active {
> .nav-icon{ > .nav-icon {
margin-left: calc(.75rem - 3px); margin-left: calc(.75rem - 3px);
}
} }
} }
} }
@ -855,7 +854,6 @@
} }
} }
.nav-collapse-hide-child { .nav-collapse-hide-child {
.menu-open > .nav-treeview { .menu-open > .nav-treeview {
max-height: min-content; max-height: min-content;
@ -864,7 +862,7 @@
animation-fill-mode: both; animation-fill-mode: both;
} }
.sidebar-collapse & { .sidebar-collapse .sidebar & {
.menu-open > .nav-treeview { .menu-open > .nav-treeview {
max-height: 0; max-height: 0;
animation-name: fadeOut; animation-name: fadeOut;
@ -873,17 +871,17 @@
} }
} }
.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused &, .sidebar-mini.sidebar-collapse,
.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover &, .sidebar-mini-md.sidebar-collapse,
.sidebar-mini-md.sidebar-collapse .main-sidebar.sidebar-focused &, .sidebar-mini-xs.sidebar-collapse {
.sidebar-mini-md.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover &, .main-sidebar.sidebar-focused &,
.sidebar-mini-xs.sidebar-collapse .main-sidebar.sidebar-focused &, .main-sidebar:not(.sidebar-no-expand):hover & {
.sidebar-mini-xs.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover & { .menu-open > .nav-treeview {
.menu-open > .nav-treeview { max-height: min-content;
max-height: min-content; animation-name: fadeIn;
animation-name: fadeIn; animation-duration: $transition-speed;
animation-duration: $transition-speed; animation-fill-mode: both;
animation-fill-mode: both; }
} }
} }
} }
@ -1136,7 +1134,7 @@
padding: $sidebar-custom-padding-x $sidebar-custom-padding-y; padding: $sidebar-custom-padding-x $sidebar-custom-padding-y;
} }
height: fill-available; height: stretch;
} }
.main-sidebar-custom-lg { .main-sidebar-custom-lg {
@ -1169,7 +1167,7 @@
} }
} }
@include dark-mode () { @include dark-mode() {
@each $name, $color in $theme-colors-alt { @each $name, $color in $theme-colors-alt {
.sidebar-dark-#{$name}, .sidebar-dark-#{$name},
.sidebar-light-#{$name} { .sidebar-light-#{$name} {

26
build/scss/_sidebar-mini.scss
View File

@ -451,19 +451,21 @@
padding-left: 0; padding-left: 0;
} }
.brand-text, .sidebar {
.user-panel > .info, .brand-text,
.nav-sidebar .nav-link p { .user-panel > .info,
margin-left: -10px; .nav-sidebar .nav-link p {
animation-name: fadeOut; margin-left: -10px;
animation-duration: $transition-speed; animation-name: fadeOut;
animation-fill-mode: both; animation-duration: $transition-speed;
visibility: hidden; animation-fill-mode: both;
width: 0; visibility: hidden;
} width: 0;
}
.nav-sidebar > .nav-item .nav-icon { .nav-sidebar > .nav-item .nav-icon {
margin-right: 0; margin-right: 0;
}
} }
} }
} }

6
build/scss/mixins/_sidebar.scss
View File

@ -45,13 +45,13 @@
display: none; display: none;
} }
.nav-sidebar .nav-link p { .sidebar .nav-sidebar .nav-link p {
width: 0; width: 0;
white-space: nowrap; white-space: nowrap;
} }
.sidebar .user-panel > .info, .sidebar .user-panel > .info,
.nav-sidebar .nav-link p, .sidebar .nav-sidebar .nav-link p,
.brand-text { .brand-text {
margin-left: -10px; margin-left: -10px;
animation-name: fadeOut; animation-name: fadeOut;
@ -109,7 +109,7 @@
} }
.user-panel > .info, .user-panel > .info,
.nav-sidebar .nav-link p, .sidebar .nav-sidebar .nav-link p,
.brand-text, .brand-text,
.logo-xl { .logo-xl {
display: inline-block; display: inline-block;