jsonTree.css 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. /*
  2. * JSON Tree Viewer
  3. * http://github.com/summerstyle/jsonTreeViewer
  4. *
  5. * Copyright 2017 Vera Lobacheva (http://iamvera.com)
  6. * Released under the MIT license (LICENSE.txt)
  7. */
  8. /* Background for the tree. May use for <body> element */
  9. .jsontree_bg {
  10. background: #FFF;
  11. }
  12. /* Styles for the container of the tree (e.g. fonts, margins etc.) */
  13. .jsontree_tree {
  14. margin-left: 30px;
  15. font-family: 'PT Mono', monospace;
  16. font-size: 14px;
  17. }
  18. /* Styles for a list of child nodes */
  19. .jsontree_child-nodes {
  20. display: none;
  21. margin-left: 35px;
  22. margin-bottom: 5px;
  23. line-height: 2;
  24. }
  25. .jsontree_node_expanded > .jsontree_value-wrapper > .jsontree_value > .jsontree_child-nodes {
  26. display: block;
  27. }
  28. /* Styles for labels */
  29. .jsontree_label-wrapper {
  30. float: left;
  31. margin-right: 8px;
  32. }
  33. .jsontree_label {
  34. font-weight: normal;
  35. vertical-align: top;
  36. color: #000;
  37. position: relative;
  38. padding: 1px;
  39. border-radius: 4px;
  40. cursor: default;
  41. }
  42. .jsontree_node_marked > .jsontree_label-wrapper > .jsontree_label {
  43. background: #fff2aa;
  44. }
  45. /* Styles for values */
  46. .jsontree_value-wrapper {
  47. display: block;
  48. overflow: hidden;
  49. }
  50. .jsontree_node_complex > .jsontree_value-wrapper {
  51. overflow: inherit;
  52. }
  53. .jsontree_value {
  54. vertical-align: top;
  55. display: inline;
  56. }
  57. .jsontree_value_null {
  58. color: #777;
  59. font-weight: bold;
  60. }
  61. .jsontree_value_string {
  62. color: #025900;
  63. font-weight: bold;
  64. }
  65. .jsontree_value_number {
  66. color: #000E59;
  67. font-weight: bold;
  68. }
  69. .jsontree_value_boolean {
  70. color: #600100;
  71. font-weight: bold;
  72. }
  73. /* Styles for active elements */
  74. .jsontree_expand-button {
  75. position: absolute;
  76. top: 3px;
  77. left: -15px;
  78. display: block;
  79. width: 11px;
  80. height: 11px;
  81. background-image: url('icons.svg');
  82. }
  83. .jsontree_node_expanded > .jsontree_label-wrapper > .jsontree_label > .jsontree_expand-button {
  84. background-position: 0 -11px;
  85. }
  86. .jsontree_show-more {
  87. cursor: pointer;
  88. }
  89. .jsontree_node_expanded > .jsontree_value-wrapper > .jsontree_value > .jsontree_show-more {
  90. display: none;
  91. }
  92. .jsontree_node_empty > .jsontree_label-wrapper > .jsontree_label > .jsontree_expand-button,
  93. .jsontree_node_empty > .jsontree_value-wrapper > .jsontree_value > .jsontree_show-more {
  94. display: none !important;
  95. }
  96. .jsontree_node_complex > .jsontree_label-wrapper > .jsontree_label {
  97. cursor: pointer;
  98. }
  99. .jsontree_node_empty > .jsontree_label-wrapper > .jsontree_label {
  100. cursor: default !important;
  101. }