From 13e0a6edb530a86acc56441980f6ed4d9fbf2022 Mon Sep 17 00:00:00 2001
From: ivar <i@oiee.no>
Date: Sun, 7 Dec 2025 22:42:14 +0100
Subject: Save

---
 code/api/wwwroot/scripts/components/dialog.js        |  8 ++++++++
 code/api/wwwroot/scripts/components/index.js         |  3 ++-
 code/api/wwwroot/scripts/components/profile-modal.js | 18 +++++++++++++++---
 code/api/wwwroot/styles/base.css                     |  6 +++++-
 4 files changed, 30 insertions(+), 5 deletions(-)
 create mode 100644 code/api/wwwroot/scripts/components/dialog.js

(limited to 'code/api/wwwroot')

diff --git a/code/api/wwwroot/scripts/components/dialog.js b/code/api/wwwroot/scripts/components/dialog.js
new file mode 100644
index 0000000..06fdfea
--- /dev/null
+++ b/code/api/wwwroot/scripts/components/dialog.js
@@ -0,0 +1,8 @@
+class Dialog extends HTMLElement {
+	constructor() {
+		super();
+	}
+}
+
+
+customElements.define("x-dialog", Dialog, {extends: "dialog"});
diff --git a/code/api/wwwroot/scripts/components/index.js b/code/api/wwwroot/scripts/components/index.js
index ffae0e3..95b4084 100644
--- a/code/api/wwwroot/scripts/components/index.js
+++ b/code/api/wwwroot/scripts/components/index.js
@@ -1,4 +1,5 @@
 function load_components() {
+	document.body.appendChild(script_tag("/scripts/components/dialog.js", 1));
     document.body.appendChild(script_tag("/scripts/components/profile-modal.js", 1));
 }
 
@@ -16,4 +17,4 @@ function script_tag(scriptSrc, version) {
     })
 }
 
-document.addEventListener("DOMContentLoaded", load_components)
\ No newline at end of file
+document.addEventListener("DOMContentLoaded", load_components)
diff --git a/code/api/wwwroot/scripts/components/profile-modal.js b/code/api/wwwroot/scripts/components/profile-modal.js
index acc666b..6d7ad27 100644
--- a/code/api/wwwroot/scripts/components/profile-modal.js
+++ b/code/api/wwwroot/scripts/components/profile-modal.js
@@ -1,16 +1,28 @@
 class ProfileModal extends HTMLElement {
+	static observedAttributes = ["target-id"];
+	#attributes = [];
+
 	constructor() {
 		super();
+		this.#attributes.push({name: "target-id", value: this.getAttribute("target-id")});
 		const _session = session.get_sync();
-		const root = create_element("div", {}, [
+		const root = create_element("template", {}, [
 			create_element("h4", {innerText: _session.username, style: {margin: 0}}),
 			create_element("p", {innerText: _session.role}),
 			create_element("button", {innerText: "Log out", classList: ["do-logout"]}),
-			create_element("pre", {innerText: Temporal.Now.instant().toString()})
 		]);
 		this.style.padding = "5px";
 		this.innerHTML = root.innerHTML;
 	}
+
+	attributeChangedCallback(name, oldValue, newValue) {
+	}
 }
 
-customElements.define("profile-modal", ProfileModal);
+customElements.define("profile-modal", ProfileModal, {extends: "dialog"});
+
+class ElementBase extends HTMLElement {
+	constructor() {
+		super();
+	}
+}
diff --git a/code/api/wwwroot/styles/base.css b/code/api/wwwroot/styles/base.css
index 318b601..fd75335 100644
--- a/code/api/wwwroot/styles/base.css
+++ b/code/api/wwwroot/styles/base.css
@@ -365,4 +365,8 @@ form .error {
     border: 1px solid red;
     background: rgba(255, 0, 0, .05);
     color: red;
-}
\ No newline at end of file
+}
+
+[inert] > * {
+    opacity: 0.5;
+}
-- 
cgit v1.3