grafana/public/sass/components/_jsontree.scss
2018-12-25 20:20:59 +01:00

77 lines
1.0 KiB
SCSS

/* Structure */
json-tree {
.json-tree-key {
vertical-align: middle;
}
.expandable {
position: relative;
&::before {
pointer-events: none;
}
&::before,
& > .json-tree-key {
cursor: pointer;
}
}
.json-tree-branch-preview {
display: inline-block;
vertical-align: middle;
}
}
/* Looks */
json-tree {
ul {
padding-left: $spacer;
}
li,
ul {
list-style: none;
}
li {
line-height: 1.3rem;
}
.json-tree-key {
color: $variable;
padding: 5px 10px 5px 15px;
&::after {
content: ':';
}
}
json-node.expandable {
&::before {
content: '\25b6';
position: absolute;
left: 0px;
font-size: 8px;
transition: transform 0.1s ease;
}
&.expanded::before {
transform: rotate(90deg);
}
}
.json-tree-leaf-value,
.json-tree-branch-preview {
word-break: break-all;
}
.json-tree-branch-preview {
overflow: hidden;
font-style: italic;
max-width: 40%;
height: 1.5em;
opacity: 0.7;
}
}