fixed sidebar nav icon with text-sm

pull/2544/head^2
REJack 2020-02-12 15:18:56 +01:00
parent b1b5ce3cb5
commit f9a40e3b46
No known key found for this signature in database
GPG Key ID: 9F3976CC630CC888
6 changed files with 190 additions and 55 deletions

View File

@ -151,6 +151,24 @@
.nav-treeview { .nav-treeview {
transition: padding $transition-speed $transition-fn; transition: padding $transition-speed $transition-fn;
padding-left: 1rem; padding-left: 1rem;
.text-sm & {
padding-left: .5rem;
}
}
&.nav-legacy {
.nav-treeview {
.nav-treeview {
padding-left: 2rem;
margin-left: -1rem;
.text-sm & {
padding-left: 1rem;
margin-left: -.5rem;
}
}
}
} }
} }
@ -632,15 +650,19 @@
> .nav-link { > .nav-link {
border-radius: 0; border-radius: 0;
margin-bottom: 0; margin-bottom: 0;
> .nav-icon {
margin-left: .55rem;
.text-sm & {
margin-left: .75rem;
}
}
} }
} }
&.nav-sidebar > .nav-item { &.nav-sidebar > .nav-item {
> .nav-link { > .nav-link {
> .nav-icon {
margin-left: .55rem;
}
&.active { &.active {
background: inherit; background: inherit;
border-left: 3px solid transparent; border-left: 3px solid transparent;
@ -648,6 +670,20 @@
> .nav-icon { > .nav-icon {
margin-left: calc(.55rem - 3px); margin-left: calc(.55rem - 3px);
.text-sm & {
margin-left: calc(.75rem - 3px);
}
}
}
}
}
.text-sm &.nav-sidebar.nav-flat .nav-treeview {
.nav-item {
> .nav-link {
> .nav-icon {
margin-left: calc(.75rem - 3px);
} }
} }
} }
@ -658,6 +694,35 @@
> .nav-item .nav-link { > .nav-item .nav-link {
.nav-icon { .nav-icon {
@include transition(margin-left $transition-fn $transition-speed); @include transition(margin-left $transition-fn $transition-speed);
margin-left: .75rem;
}
}
}
.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused &.nav-child-indent,
.sidebar-mini.sidebar-collapse .main-sidebar:hover &.nav-child-indent,
.sidebar-mini-md.sidebar-collapse .main-sidebar.sidebar-focused &.nav-child-indent,
.sidebar-mini-md.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 {
.nav-treeview {
padding-left: .5rem;
.nav-treeview {
padding-left: 1rem;
margin-left: -.5rem;
} }
} }
} }
@ -670,11 +735,36 @@
} }
&.active { &.active {
> .nav-icon { > .nav-icon{
margin-left: .36rem; margin-left: .36rem;
} }
} }
} }
&.nav-child-indent {
.nav-treeview {
.nav-treeview {
padding-left: 0;
margin-left: 0;
}
}
}
}
.sidebar-mini.sidebar-collapse.text-sm &,
.sidebar-mini-md.sidebar-collapse.text-sm &, {
> .nav-item > .nav-link {
.nav-icon {
margin-left: .75rem;
}
&.active {
> .nav-icon{
margin-left: calc(.75rem - 3px);
}
}
}
} }
[class*='sidebar-dark'] & { [class*='sidebar-dark'] & {
@ -737,7 +827,9 @@
} }
.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused &, .sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused &,
.sidebar-mini.sidebar-collapse .main-sidebar:hover & { .sidebar-mini.sidebar-collapse .main-sidebar:hover &,
.sidebar-mini-md.sidebar-collapse .main-sidebar.sidebar-focused &,
.sidebar-mini-md.sidebar-collapse .main-sidebar:hover & {
.menu-open > .nav-treeview { .menu-open > .nav-treeview {
max-height: min-content; max-height: min-content;
opacity: 1; opacity: 1;
@ -762,6 +854,13 @@
.nav-link > p > .right { .nav-link > p > .right {
top: .465rem; top: .465rem;
} }
.text-sm & {
.nav-link > .right,
.nav-link > p > .right {
top: .7rem;
}
}
} }
// Sidebar Form Control // Sidebar Form Control

View File

@ -111,30 +111,6 @@
.nav-sidebar > .nav-item .nav-icon { .nav-sidebar > .nav-item .nav-icon {
margin-right: 0; margin-right: 0;
} }
.nav-flat {
.nav-icon {
margin-left: .5rem;
}
.nav-treeview {
.nav-icon {
margin-left: .3rem;
}
}
}
.nav-flat.nav-compact {
.nav-icon {
margin-left: 1.05rem;
}
.nav-treeview {
.nav-icon {
margin-left: .85rem;
}
}
}
} }
} }

104
dist/css/adminlte.css vendored
View File

@ -11754,6 +11754,20 @@ body.sidebar-collapse:not(.sidebar-mini-md):not(.sidebar-mini) .main-header::bef
padding-left: 1rem; padding-left: 1rem;
} }
.text-sm .nav-sidebar.nav-child-indent .nav-treeview {
padding-left: .5rem;
}
.nav-sidebar.nav-child-indent.nav-legacy .nav-treeview .nav-treeview {
padding-left: 2rem;
margin-left: -1rem;
}
.text-sm .nav-sidebar.nav-child-indent.nav-legacy .nav-treeview .nav-treeview {
padding-left: 1rem;
margin-left: -.5rem;
}
.nav-sidebar .nav-header { .nav-sidebar .nav-header {
font-size: .9rem; font-size: .9rem;
padding: 0.5rem; padding: 0.5rem;
@ -12396,10 +12410,14 @@ body.sidebar-collapse:not(.sidebar-mini-md):not(.sidebar-mini) .main-header::bef
margin-bottom: 0; margin-bottom: 0;
} }
.nav-legacy.nav-sidebar > .nav-item > .nav-link > .nav-icon { .nav-legacy.nav-sidebar .nav-item > .nav-link > .nav-icon {
margin-left: .55rem; margin-left: .55rem;
} }
.text-sm .nav-legacy.nav-sidebar .nav-item > .nav-link > .nav-icon {
margin-left: .75rem;
}
.nav-legacy.nav-sidebar > .nav-item > .nav-link.active { .nav-legacy.nav-sidebar > .nav-item > .nav-link.active {
background: inherit; background: inherit;
border-left: 3px solid transparent; border-left: 3px solid transparent;
@ -12410,9 +12428,18 @@ body.sidebar-collapse:not(.sidebar-mini-md):not(.sidebar-mini) .main-header::bef
margin-left: calc(.55rem - 3px); margin-left: calc(.55rem - 3px);
} }
.text-sm .nav-legacy.nav-sidebar > .nav-item > .nav-link.active > .nav-icon {
margin-left: calc(.75rem - 3px);
}
.text-sm .nav-legacy.nav-sidebar.nav-flat .nav-treeview .nav-item > .nav-link > .nav-icon {
margin-left: calc(.75rem - 3px);
}
.sidebar-mini .nav-legacy > .nav-item .nav-link .nav-icon, .sidebar-mini .nav-legacy > .nav-item .nav-link .nav-icon,
.sidebar-mini-md .nav-legacy > .nav-item .nav-link .nav-icon { .sidebar-mini-md .nav-legacy > .nav-item .nav-link .nav-icon {
transition: margin-left ease-in-out 0.3s; transition: margin-left ease-in-out 0.3s;
margin-left: .75rem;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
@ -12422,6 +12449,36 @@ body.sidebar-collapse:not(.sidebar-mini-md):not(.sidebar-mini) .main-header::bef
} }
} }
.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview,
.sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-legacy.nav-child-indent .nav-treeview,
.sidebar-mini-md.sidebar-collapse .main-sidebar.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview,
.sidebar-mini-md.sidebar-collapse .main-sidebar:hover .nav-legacy.nav-child-indent .nav-treeview {
padding-left: 1rem;
}
.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview .nav-treeview,
.sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-legacy.nav-child-indent .nav-treeview .nav-treeview,
.sidebar-mini-md.sidebar-collapse .main-sidebar.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview .nav-treeview,
.sidebar-mini-md.sidebar-collapse .main-sidebar:hover .nav-legacy.nav-child-indent .nav-treeview .nav-treeview {
padding-left: 2rem;
margin-left: -1rem;
}
.sidebar-mini.sidebar-collapse.text-sm .main-sidebar.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview,
.sidebar-mini.sidebar-collapse.text-sm .main-sidebar:hover .nav-legacy.nav-child-indent .nav-treeview,
.sidebar-mini-md.sidebar-collapse.text-sm .main-sidebar.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview,
.sidebar-mini-md.sidebar-collapse.text-sm .main-sidebar:hover .nav-legacy.nav-child-indent .nav-treeview {
padding-left: .5rem;
}
.sidebar-mini.sidebar-collapse.text-sm .main-sidebar.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview .nav-treeview,
.sidebar-mini.sidebar-collapse.text-sm .main-sidebar:hover .nav-legacy.nav-child-indent .nav-treeview .nav-treeview,
.sidebar-mini-md.sidebar-collapse.text-sm .main-sidebar.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview .nav-treeview,
.sidebar-mini-md.sidebar-collapse.text-sm .main-sidebar:hover .nav-legacy.nav-child-indent .nav-treeview .nav-treeview {
padding-left: 1rem;
margin-left: -.5rem;
}
.sidebar-mini.sidebar-collapse .nav-legacy > .nav-item > .nav-link .nav-icon, .sidebar-mini.sidebar-collapse .nav-legacy > .nav-item > .nav-link .nav-icon,
.sidebar-mini-md.sidebar-collapse .nav-legacy > .nav-item > .nav-link .nav-icon { .sidebar-mini-md.sidebar-collapse .nav-legacy > .nav-item > .nav-link .nav-icon {
margin-left: .55rem; margin-left: .55rem;
@ -12432,6 +12489,22 @@ body.sidebar-collapse:not(.sidebar-mini-md):not(.sidebar-mini) .main-header::bef
margin-left: .36rem; margin-left: .36rem;
} }
.sidebar-mini.sidebar-collapse .nav-legacy.nav-child-indent .nav-treeview .nav-treeview,
.sidebar-mini-md.sidebar-collapse .nav-legacy.nav-child-indent .nav-treeview .nav-treeview {
padding-left: 0;
margin-left: 0;
}
.sidebar-mini.sidebar-collapse.text-sm .nav-legacy > .nav-item > .nav-link .nav-icon,
.sidebar-mini-md.sidebar-collapse.text-sm .nav-legacy > .nav-item > .nav-link .nav-icon {
margin-left: .75rem;
}
.sidebar-mini.sidebar-collapse.text-sm .nav-legacy > .nav-item > .nav-link.active > .nav-icon,
.sidebar-mini-md.sidebar-collapse.text-sm .nav-legacy > .nav-item > .nav-link.active > .nav-icon {
margin-left: calc(.75rem - 3px);
}
[class*='sidebar-dark'] .nav-legacy.nav-sidebar > .nav-item .nav-treeview, [class*='sidebar-dark'] .nav-legacy.nav-sidebar > .nav-item .nav-treeview,
[class*='sidebar-dark'] .nav-legacy.nav-sidebar > .nav-item > .nav-treeview { [class*='sidebar-dark'] .nav-legacy.nav-sidebar > .nav-item > .nav-treeview {
background: rgba(255, 255, 255, 0.05); background: rgba(255, 255, 255, 0.05);
@ -12473,7 +12546,9 @@ body.sidebar-collapse:not(.sidebar-mini-md):not(.sidebar-mini) .main-header::bef
} }
.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .nav-collapse-hide-child .menu-open > .nav-treeview, .sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .nav-collapse-hide-child .menu-open > .nav-treeview,
.sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-collapse-hide-child .menu-open > .nav-treeview { .sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-collapse-hide-child .menu-open > .nav-treeview,
.sidebar-mini-md.sidebar-collapse .main-sidebar.sidebar-focused .nav-collapse-hide-child .menu-open > .nav-treeview,
.sidebar-mini-md.sidebar-collapse .main-sidebar:hover .nav-collapse-hide-child .menu-open > .nav-treeview {
max-height: -webkit-min-content; max-height: -webkit-min-content;
max-height: -moz-min-content; max-height: -moz-min-content;
max-height: min-content; max-height: min-content;
@ -12496,6 +12571,11 @@ body.sidebar-collapse:not(.sidebar-mini-md):not(.sidebar-mini) .main-header::bef
top: .465rem; top: .465rem;
} }
.text-sm .nav-compact .nav-link > .right,
.text-sm .nav-compact .nav-link > p > .right {
top: .7rem;
}
[class*='sidebar-dark'] .form-control-sidebar, [class*='sidebar-dark'] .form-control-sidebar,
[class*='sidebar-dark'] .btn-sidebar { [class*='sidebar-dark'] .btn-sidebar {
background: #3f474e; background: #3f474e;
@ -12836,26 +12916,6 @@ body.sidebar-collapse:not(.sidebar-mini-md):not(.sidebar-mini) .main-header::bef
margin-right: 0; margin-right: 0;
} }
.sidebar-collapse .sidebar-no-expand.main-sidebar.sidebar-focused .nav-flat .nav-icon,
.sidebar-collapse .sidebar-no-expand.main-sidebar:hover .nav-flat .nav-icon {
margin-left: .5rem;
}
.sidebar-collapse .sidebar-no-expand.main-sidebar.sidebar-focused .nav-flat .nav-treeview .nav-icon,
.sidebar-collapse .sidebar-no-expand.main-sidebar:hover .nav-flat .nav-treeview .nav-icon {
margin-left: .3rem;
}
.sidebar-collapse .sidebar-no-expand.main-sidebar.sidebar-focused .nav-flat.nav-compact .nav-icon,
.sidebar-collapse .sidebar-no-expand.main-sidebar:hover .nav-flat.nav-compact .nav-icon {
margin-left: 1.05rem;
}
.sidebar-collapse .sidebar-no-expand.main-sidebar.sidebar-focused .nav-flat.nav-compact .nav-treeview .nav-icon,
.sidebar-collapse .sidebar-no-expand.main-sidebar:hover .nav-flat.nav-compact .nav-treeview .nav-icon {
margin-left: .85rem;
}
.nav-sidebar { .nav-sidebar {
position: relative; position: relative;
} }

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long