init

2026-01-04 07:58:23 -06:00
parent b50468eb5a
commit 6a435ac11a
122 changed files with 13995 additions and 19 deletions
--- a/ui/desktop/components/InputBox.js
+++ b/ui/desktop/components/InputBox.js
@@ -0,0 +1,54 @@
+css(`
+    input-box {
+        display: block;
+        width: 60vw;
+        position: fixed;
+        left: 20vw;
+        bottom: 2vw;
+    }
+
+    .input {
+        width: 100%;
+        background-color: var(--accent2);
+        opacity: 0.5;
+        border-radius: 12px;
+        border: none;
+        resize: none;
+        color: var(--orange);
+        padding: 1em;
+        height: 1em;
+        outline: none;
+        transition: opacity .1s, scale .1s
+    }
+
+    .input:focus {
+        opacity: 80%;
+        scale: 1.02
+    }
+`)
+
+export default class InputBox extends HTMLElement {
+    hovered = false
+
+    connectedCallback() {
+        this.render()
+        this.addListeners()
+    }
+
+    render() {
+        this.innerHTML = /* html */`
+            <textarea class="input"></textarea>
+        `
+    }
+
+    addListeners() {
+        this.$("textarea").addEventListener("keydown", (e) => {
+            if(e.key === "Enter") {
+                e.preventDefault()
+                e.target.blur()
+            }
+        })
+    }
+}
+
+customElements.define("input-box", InputBox)