feat: first functioning code

2026-03-29 12:01:11 +02:00
parent f5516e4bb0
commit 07c3a6c56a
8 changed files with 2293 additions and 0 deletions
--- a/static/styles.css
+++ b/static/styles.css
@@ -0,0 +1,125 @@
+html,
+body {
+  height: 100%;
+  margin: 0;
+  font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
+  background: #111;
+}
+
+#app {
+  position: fixed;
+  inset: 0;
+}
+
+#canvasWrap {
+  position: absolute;
+  inset: 0;
+}
+
+#graphCanvas {
+  width: 100%;
+  height: 100%;
+  display: block;
+}
+
+#hamburger {
+  position: absolute;
+  top: 10px;
+  left: 10px;
+  z-index: 50;
+  width: 40px;
+  height: 40px;
+  border-radius: 8px;
+  border: 1px solid rgba(255, 255, 255, 0.15);
+  background: rgba(30, 30, 30, 0.9);
+  color: #fff;
+  font-size: 18px;
+}
+
+#topRight {
+  position: absolute;
+  top: 10px;
+  right: 10px;
+  z-index: 50;
+  display: flex;
+  gap: 8px;
+}
+
+#topRight button {
+  padding: 8px 12px;
+  border-radius: 8px;
+  border: 1px solid rgba(255, 255, 255, 0.15);
+  background: rgba(30, 30, 30, 0.9);
+  color: #fff;
+}
+
+#sidebar {
+  position: absolute;
+  top: 60px;
+  left: 10px;
+  z-index: 60;
+  width: 320px;
+  max-height: calc(100% - 60px - 200px);
+  overflow: auto;
+  border-radius: 10px;
+  border: 1px solid rgba(255, 255, 255, 0.12);
+  background: rgba(20, 20, 20, 0.95);
+  color: #fff;
+  padding: 10px;
+}
+
+#sidebar.hidden {
+  display: none;
+}
+
+.sidebarHeader {
+  font-weight: 600;
+  margin-bottom: 8px;
+}
+
+#sidebar summary {
+  cursor: pointer;
+  padding: 6px 0;
+  font-weight: 600;
+}
+
+.sidebarGroup {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding: 6px 0 10px;
+}
+
+.entityBtn {
+  text-align: left;
+  padding: 8px 10px;
+  border-radius: 8px;
+  border: 1px solid rgba(255, 255, 255, 0.12);
+  background: rgba(40, 40, 40, 0.9);
+  color: #fff;
+}
+
+#output {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  height: 180px;
+  z-index: 40;
+  border-top: 1px solid rgba(255, 255, 255, 0.12);
+  background: rgba(10, 10, 10, 0.92);
+  padding: 8px;
+}
+
+#outputText {
+  width: 100%;
+  height: 100%;
+  resize: none;
+  border: 1px solid rgba(255, 255, 255, 0.12);
+  border-radius: 8px;
+  background: rgba(0, 0, 0, 0.35);
+  color: #eaeaea;
+  padding: 8px;
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+  font-size: 12px;
+}