initial files

public/styles/jsonTree.css

@@ -0,0 +1,79 @@
+.json-controls {
+    position: sticky;
+    top: -8px;
+    backdrop-filter: blur(5px);
+    padding: 8px;
+    border-bottom: 2px solid var(--theme-window-titlebar-backcolor);
+    z-index: 1;
+}
+
+.json-controls button {
+    background: var(--theme-window-backcolor) !important;
+    color: var(--theme-window-color) !important;
+}
+
+.json-line {
+    padding: 3px 0;
+    white-space: pre;
+}
+
+.json-key {
+    color: #d73a49;
+}
+
+.json-input {
+    padding: 3px 8px;
+    border: none;
+    background: transparent;
+    outline: none;
+}
+
+.json-input.string {
+    color: #032f62;
+}
+
+.json-input.number {
+    color: #005cc5;
+}
+
+.json-toggle {
+    cursor:var(--theme-cursor-pointer) -16 16, pointer;
+    color: #6f42c1;
+}
+
+.json-children {
+    padding: 3px 0;
+}
+
+.json-children.collapsed {
+    display: none;
+}
+
+.json-header {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+}
+
+.json-add {
+    cursor:var(--theme-cursor-pointer) -16 16, pointer;
+    color: #28a745;
+    opacity: 0.7;
+    font-size: 13px;
+}
+
+.json-add:hover {
+    opacity: 1;
+}
+
+.json-remove {
+    cursor:var(--theme-cursor-pointer) -16 16, pointer;
+    color: #dc3545;
+    opacity: 0.6;
+    margin-left: 6px;
+    font-size: 12px;
+}
+
+.json-remove:hover {
+    opacity: 1;
+}