12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576 |
- /* 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: 18px;
- }
- .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;
- }
- }
|