diff --git a/static/css/main.css b/static/css/main.css index 8a1078e..e56b823 100644 --- a/static/css/main.css +++ b/static/css/main.css @@ -300,3 +300,19 @@ dialog#connection-data div.button { text-align: center; margin-top: 8px; } +#editor-type-schema .label { + font-size: 1.25em; + font-weight: bold; + color: var(--section-color); +} +#editor-type-schema textarea { + font-family: monospace; + font-size: 0.85em; + margin-top: 16px; + width: 100%; + height: calc(100% - 96px); + min-height: calc(100vh - 380px); +} +#editor-type-schema img { + height: 32px; +} diff --git a/static/js/app.mjs b/static/js/app.mjs index 4c1b7a6..cff0b86 100644 --- a/static/js/app.mjs +++ b/static/js/app.mjs @@ -23,6 +23,7 @@ export class App { 'NODE_MOVE', 'NODE_SELECTED', 'TREE_RELOAD_NODE', + 'TYPE_EDIT', 'TYPES_LIST_FETCHED', ] for (const eventName of events) @@ -106,6 +107,11 @@ export class App { .catch(err => showError(err)) break + case 'TYPE_EDIT': + const editor = new TypeSchemaEditor(event.detail.Type) + document.getElementById('editor-type-schema').replaceChildren(editor.render()) + break + default: alert(`Unhandled event: ${event.type}`) console.log(event) @@ -712,6 +718,7 @@ export class TypesList {