200 lines
5.1 KiB
Plaintext
200 lines
5.1 KiB
Plaintext
.sidenav-tree {
|
|
width: 280px;
|
|
background: @color-sidebarnav-bg;
|
|
|
|
.control-toolbar {
|
|
height: auto;
|
|
padding: 20px 0 20px 20px;
|
|
|
|
input.form-control {
|
|
border: none;
|
|
}
|
|
}
|
|
|
|
ul {
|
|
padding: 0;
|
|
margin: 0;
|
|
list-style: none;
|
|
}
|
|
|
|
div.scrollbar-thumb {
|
|
background: #2b3e50!important;
|
|
}
|
|
|
|
ul.top-level > li {
|
|
&[data-status=collapsed] {
|
|
> div.group h3:before {
|
|
.transform(~'rotate(0deg) translate(3px, 0)');
|
|
}
|
|
|
|
ul {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
> div.group {
|
|
h3 {
|
|
background: @color-sidebarnav-tree-group-bg;
|
|
color: @color-sidebarnav-tree-group;
|
|
text-transform: uppercase;
|
|
font-size: 14px;
|
|
padding: 15px 15px 15px 33px;
|
|
margin: 0;
|
|
position: relative;
|
|
cursor: pointer;
|
|
|
|
&:before {
|
|
width: 10px;
|
|
height: 10px;
|
|
display: block;
|
|
position: absolute;
|
|
top: 1px;
|
|
}
|
|
|
|
&:before {
|
|
left: 13px;
|
|
top: 15px;
|
|
color: @color-list-arrow;
|
|
.icon(@caret-right);
|
|
.transform(~'rotate(90deg) translate(5px, 0)');
|
|
.transition(all 0.1s ease);
|
|
}
|
|
}
|
|
}
|
|
|
|
> ul {
|
|
li {
|
|
a {
|
|
display: block;
|
|
position: relative;
|
|
padding: 15px 15px 15px 40px;
|
|
background: @color-sidebarnav-tree-inactive-bg;
|
|
margin-bottom: 1px;
|
|
color: @color-sidebarnav-tree-inactive-text;
|
|
text-decoration: none!important;
|
|
|
|
&:hover {
|
|
text-decoration: none;
|
|
}
|
|
|
|
i {
|
|
position: absolute;
|
|
left: 15px;
|
|
top: 17px;
|
|
font-size: 16px;
|
|
}
|
|
|
|
span {
|
|
display: block;
|
|
line-height: 150%;
|
|
|
|
&.header {
|
|
color: @color-sidebarnav-tree-inactive-header;
|
|
font-size: 14px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
&.description {
|
|
color: @color-sidebarnav-tree-inactive-desc;
|
|
font-size: 12px;
|
|
font-weight: 100;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.active a {
|
|
background: @color-sidebarnav-tree-active-bg;
|
|
color: @color-sidebarnav-tree-active-text;
|
|
|
|
&:before {
|
|
content: ' ';
|
|
position: absolute;
|
|
width: 4px;
|
|
background: @color-sidebarnav-tree-active-marker;
|
|
left: 0;
|
|
top: 0;
|
|
height: 100%;
|
|
}
|
|
|
|
span.header {
|
|
color: @color-sidebarnav-tree-active-header;
|
|
}
|
|
|
|
span.description {
|
|
color: @color-sidebarnav-tree-active-text;
|
|
}
|
|
}
|
|
|
|
&:last-child a {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
&:hover a {
|
|
background-color: @color-sidebarnav-tree-active-bg;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.back-link {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
@media (max-width: @screen-sm) {
|
|
.sidenav-tree {
|
|
width: 100%;
|
|
height: auto !important;
|
|
display: block !important;
|
|
|
|
> .layout {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.sidenav-tree-root {
|
|
.sidenav-tree {
|
|
width: 100% !important;
|
|
height: 100% !important;
|
|
display: table-cell !important;
|
|
|
|
.back-link {
|
|
display: none !important;
|
|
}
|
|
|
|
> .layout {
|
|
display: table !important;
|
|
}
|
|
}
|
|
|
|
#layout-body {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
body.has-sidenav-tree {
|
|
.sidenav-tree {
|
|
.back-link {
|
|
display: block;
|
|
padding: 13px 15px;
|
|
background: @color-sidebarnav-back-link-bg;
|
|
color: @color-sidebarnav-back-link-text;
|
|
font-size: 14px;
|
|
line-height: 14px;
|
|
text-transform: uppercase;
|
|
i {
|
|
display: inline-block;
|
|
margin-right: 10px;
|
|
}
|
|
&:hover {
|
|
text-decoration: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
#layout-body {
|
|
display: block !important;
|
|
}
|
|
}
|
|
}
|