/* * JSON Tree Viewer * http://github.com/summerstyle/jsonTreeViewer * * Copyright 2017 Vera Lobacheva (http://iamvera.com) * Released under the MIT license (LICENSE.txt) */ /* Background for the tree. May use for element */ .jt_bg { background: #FFF; } /* Styles for the container of the tree (e.g. fonts, margins etc.) */ .jt_tree { margin: 0; padding: 0; font-family: 'PT Mono', monospace; font-size: 14px; } #jsontree-canvas { position: absolute; width: 100%; height: 100%; overflow-y: scroll; } #jsontree-canvas ul { list-style-type: none; } /* Styles for a list of child nodes */ .jt_child-nodes { display: none; margin-left: 10px; padding-left: 16px; margin-bottom: 5px; line-height: 1.5; } .jt_node_expanded > .jt_value-wrapper > .jt_value > .jt_child-nodes { display: block; } /* Styles for labels */ .jt_label-wrapper { float: left; margin-right: 8px; } .jt_label { font-weight: normal; vertical-align: top; color: #e8f8f9; position: relative; padding: 1px; border-radius: 4px; cursor: default; } .jt_node_marked > .jt_label-wrapper > .jt_label { background: #635a23; } /* Styles for values */ .jt_value-wrapper { display: block; overflow: hidden; } .jt_node_complex > .jt_value-wrapper { overflow: inherit; } .jt_value { vertical-align: top; display: inline; } .jt_value_null { color: #777; font-weight: bold; } .jt_value_string { color: #758bff; font-weight: bold; } .jt_value_number { color: #0ab507; font-weight: bold; } .jt_value_boolean { color: #bf1311; font-weight: bold; } /* Styles for active elements */ .jt_expand-button { position: absolute; top: 3px; left: -15px; display: block; width: 11px; height: 11px; background-image: url('icons.svg'); transition: transform 0.15s; } .jt_node_expanded > .jt_label-wrapper > .jt_label > .jt_expand-button { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .jt_show-more { cursor: pointer; background: #777; display: inline-block; line-height: 0.75; font-size: 10px; padding: 2px 4px 6px; border-radius: 3px; } .jt_node_expanded > .jt_value-wrapper > .jt_value > .jt_show-more { display: none; } .jt_node_empty > .jt_label-wrapper > .jt_label > .jt_expand-button, .jt_node_empty > .jt_value-wrapper > .jt_value > .jt_show-more { display: none !important; } .jt_node_complex > .jt_label-wrapper > .jt_label { cursor: pointer; } .jt_node_empty > .jt_label-wrapper > .jt_label { cursor: default !important; }