393 lines
8.0 KiB
SCSS
393 lines
8.0 KiB
SCSS
/**
|
|
* Copyright © 2016-2020 The Thingsboard Authors
|
|
*
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
*/
|
|
.tb-nav-tree-container {
|
|
padding: 15px;
|
|
font-family: Roboto, "Helvetica Neue", sans-serif;
|
|
|
|
&.jstree-proton, &.jstree-proton-small, &.jstree-proton-large {
|
|
.jstree-node,
|
|
.jstree-icon {
|
|
background-image: url("../../../assets/jstree/tb32px.png");
|
|
}
|
|
|
|
.jstree-last {
|
|
background: transparent;
|
|
}
|
|
|
|
.jstree-themeicon-custom {
|
|
background-image: none;
|
|
}
|
|
}
|
|
|
|
&.jstree-proton {
|
|
|
|
.jstree-themeicon-custom {
|
|
&.material-icons {
|
|
font-size: 18px;
|
|
}
|
|
}
|
|
|
|
.jstree-anchor {
|
|
font-size: 16px;
|
|
}
|
|
|
|
.jstree-file {
|
|
background: url("../../../assets/jstree/tb32px.png") -101px -69px no-repeat;
|
|
}
|
|
|
|
.jstree-folder {
|
|
background: url("../../../assets/jstree/tb32px.png") -261px -5px no-repeat;
|
|
}
|
|
}
|
|
|
|
&.jstree-proton-small {
|
|
|
|
.jstree-themeicon-custom {
|
|
&.material-icons {
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
|
|
.jstree-anchor {
|
|
font-size: 14px;
|
|
}
|
|
|
|
.jstree-file {
|
|
background: url("../../../assets/jstree/tb32px.png") -103px -71px no-repeat;
|
|
}
|
|
|
|
.jstree-folder {
|
|
background: url("../../../assets/jstree/tb32px.png") -263px -7px no-repeat;
|
|
}
|
|
}
|
|
|
|
&.jstree-proton-large {
|
|
|
|
.jstree-themeicon-custom {
|
|
&.material-icons {
|
|
font-size: 24px;
|
|
}
|
|
}
|
|
|
|
.jstree-anchor {
|
|
font-size: 20px;
|
|
}
|
|
|
|
.jstree-file {
|
|
background: url("../../../assets/jstree/tb32px.png") -96px -64px no-repeat;
|
|
}
|
|
|
|
.jstree-folder {
|
|
background: url("../../../assets/jstree/tb32px.png") -256px 0px no-repeat;
|
|
}
|
|
}
|
|
|
|
a {
|
|
border-bottom: none;
|
|
|
|
i.jstree-themeicon-custom {
|
|
&.tb-user-group {
|
|
&::before {
|
|
content: "account_circle";
|
|
}
|
|
}
|
|
|
|
&.tb-customer-group {
|
|
&::before {
|
|
content: "supervisor_account";
|
|
}
|
|
}
|
|
|
|
&.tb-asset-group {
|
|
&::before {
|
|
content: "domain";
|
|
}
|
|
}
|
|
|
|
&.tb-device-group {
|
|
&::before {
|
|
content: "devices_other";
|
|
}
|
|
}
|
|
|
|
&.tb-entity-view-group {
|
|
&::before {
|
|
content: "view_quilt";
|
|
}
|
|
}
|
|
|
|
&.tb-dashboard-group {
|
|
&::before {
|
|
content: "dashboard";
|
|
}
|
|
}
|
|
|
|
&.tb-customer {
|
|
&::before {
|
|
content: "supervisor_account";
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
#jstree-dnd {
|
|
&.jstree-proton, &.jstree-proton-small, &.jstree-proton-large {
|
|
.jstree-ok,
|
|
.jstree-er {
|
|
background-image: url("../../../assets/jstree/tb32px.png");
|
|
}
|
|
}
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.tb-nav-tree-container {
|
|
&.jstree-proton-responsive {
|
|
.jstree-node,
|
|
.jstree-icon,
|
|
.jstree-node > .jstree-ocl,
|
|
.jstree-themeicon,
|
|
.jstree-checkbox {
|
|
background-image: url("../../../assets/jstree/tb40px.png");
|
|
background-size: 120px 240px;
|
|
}
|
|
|
|
.jstree-container-ul {
|
|
overflow: visible;
|
|
}
|
|
|
|
.jstree-themeicon-custom {
|
|
background-color: transparent;
|
|
background-image: none;
|
|
background-position: 0 0;
|
|
|
|
&.material-icons {
|
|
margin: 0;
|
|
font-size: 24px;
|
|
}
|
|
}
|
|
|
|
.jstree-node,
|
|
.jstree-leaf > .jstree-ocl {
|
|
background: 0 0;
|
|
}
|
|
|
|
.jstree-node {
|
|
min-width: 40px;
|
|
min-height: 40px;
|
|
margin-left: 40px;
|
|
line-height: 40px;
|
|
white-space: nowrap;
|
|
background-repeat: repeat-y;
|
|
background-position: -80px 0;
|
|
}
|
|
|
|
.jstree-last {
|
|
background: 0 0;
|
|
}
|
|
|
|
.jstree-anchor {
|
|
height: 40px;
|
|
font-size: 1.1em;
|
|
font-weight: 700;
|
|
line-height: 40px;
|
|
text-shadow: 1px 1px #fff;
|
|
}
|
|
|
|
.jstree-icon,
|
|
.jstree-icon:empty {
|
|
width: 40px;
|
|
height: 40px;
|
|
line-height: 40px;
|
|
}
|
|
|
|
> {
|
|
.jstree-container-ul > .jstree-node {
|
|
margin-right: 0;
|
|
margin-left: 0;
|
|
}
|
|
}
|
|
|
|
.jstree-ocl,
|
|
.jstree-themeicon,
|
|
.jstree-checkbox {
|
|
background-size: 120px 240px;
|
|
}
|
|
|
|
.jstree-leaf > .jstree-ocl {
|
|
background: 0 0;
|
|
background-position: -40px -120px;
|
|
}
|
|
|
|
.jstree-last > .jstree-ocl {
|
|
background-position: -40px -160px;
|
|
}
|
|
|
|
.jstree-open > .jstree-ocl {
|
|
background-position: 0 0 !important;
|
|
}
|
|
|
|
.jstree-closed > .jstree-ocl {
|
|
background-position: 0 -40px !important;
|
|
}
|
|
|
|
.jstree-themeicon {
|
|
background-position: -40px -40px;
|
|
}
|
|
|
|
.jstree-file {
|
|
background: url("../../../assets/jstree/tb40px.png") 0 -160px no-repeat;
|
|
background-size: 120px 240px;
|
|
}
|
|
.jstree-folder {
|
|
background: url("../../../assets/jstree/tb40px.png") -40px -40px no-repeat;
|
|
background-size: 120px 240px;
|
|
}
|
|
|
|
.jstree-checkbox,
|
|
.jstree-checkbox:hover {
|
|
background-position: -40px -80px;
|
|
}
|
|
|
|
&.jstree-checkbox-selection {
|
|
.jstree-clicked > .jstree-checkbox,
|
|
.jstree-clicked > .jstree-checkbox:hover {
|
|
background-position: 0 -80px;
|
|
}
|
|
}
|
|
|
|
.jstree-checked > .jstree-checkbox,
|
|
.jstree-checked > .jstree-checkbox:hover {
|
|
background-position: 0 -80px;
|
|
}
|
|
|
|
.jstree-anchor > .jstree-undetermined,
|
|
.jstree-anchor > .jstree-undetermined:hover {
|
|
background-position: 0 -120px;
|
|
}
|
|
|
|
.jstree-striped {
|
|
background: 0 0;
|
|
}
|
|
|
|
.jstree-wholerow {
|
|
height: 40px;
|
|
background: #ebebeb;
|
|
border-top: 1px solid rgba(255, 255, 255, .7);
|
|
border-bottom: 1px solid rgba(64, 64, 64, .2);
|
|
}
|
|
|
|
.jstree-wholerow-hovered {
|
|
background: #e7f4f9;
|
|
}
|
|
|
|
.jstree-wholerow-clicked {
|
|
background: #beebff;
|
|
}
|
|
|
|
.jstree-children {
|
|
.jstree-last > .jstree-wholerow {
|
|
box-shadow: inset 0 -6px 3px -5px #666;
|
|
}
|
|
|
|
.jstree-open > .jstree-wholerow {
|
|
border-top: 0;
|
|
box-shadow: inset 0 6px 3px -5px #666;
|
|
}
|
|
|
|
.jstree-open + .jstree-open {
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
|
|
&.jstree-rtl {
|
|
.jstree-node {
|
|
margin-right: 40px;
|
|
margin-left: 0;
|
|
}
|
|
|
|
.jstree-container-ul > .jstree-node {
|
|
margin-right: 0;
|
|
}
|
|
|
|
.jstree-closed > .jstree-ocl {
|
|
background-position: -40px 0 !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
#jstree-dnd {
|
|
&.jstree-dnd-responsive {
|
|
.jstree-ok,
|
|
.jstree-er {
|
|
background-image: url("../../../assets/jstree/tb40px.png");
|
|
background-size: 120px 240px;
|
|
}
|
|
.jstree-ok {
|
|
background-position: 0 -200px;
|
|
}
|
|
.jstree-er {
|
|
background-position: -40px -200px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.tb-nav-tree .mat-button.tb-active {
|
|
font-weight: 500;
|
|
background-color: rgba(255, 255, 255, .15);
|
|
}
|
|
|
|
.tb-nav-tree,
|
|
.tb-nav-tree ul {
|
|
margin-top: 0;
|
|
list-style: none;
|
|
|
|
&:first-child {
|
|
padding: 0;
|
|
}
|
|
|
|
li {
|
|
.mat-button {
|
|
width: 100%;
|
|
max-height: 40px;
|
|
padding: 0 16px;
|
|
margin: 0;
|
|
overflow: hidden;
|
|
line-height: 40px;
|
|
color: inherit;
|
|
text-align: left;
|
|
text-decoration: none;
|
|
text-overflow: ellipsis;
|
|
text-transform: none;
|
|
text-rendering: optimizeLegibility;
|
|
white-space: nowrap;
|
|
cursor: pointer;
|
|
border-radius: 0;
|
|
|
|
span {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|