From 979307095ddadfa4ad41df32c23d231e3b91eae9 Mon Sep 17 00:00:00 2001
From: Arthur Lu <learthurgo@gmail.com>
Date: Tue, 13 Dec 2022 23:26:43 -0800
Subject: [PATCH] fix instance type setting, add min-content to center-div

---
 css/style.css       | 1 +
 scripts/elements.js | 8 ++++----
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/css/style.css b/css/style.css
index 31494d4..65590d4 100644
--- a/css/style.css
+++ b/css/style.css
@@ -32,6 +32,7 @@ p {
 .center-div {
 	min-width: 480px;
 	max-width: 50%;
+	width: min-content;
 	margin-left: auto;
 	margin-right: auto;
 }
diff --git a/scripts/elements.js b/scripts/elements.js
index 947e2ea..e376936 100644
--- a/scripts/elements.js
+++ b/scripts/elements.js
@@ -58,8 +58,8 @@ class Instance extends HTMLElement {
 		super();
 		let shadowRoot = this.attachShadow({mode: "open"});
 
-		let instanceDiv = document.createElement("div");
-		shadowRoot.append(instanceDiv);
+		let instanceArticle = document.createElement("article");
+		shadowRoot.append(instanceArticle);
 
 		let styleLink = document.createElement("link");
 		styleLink.rel = "stylesheet";
@@ -71,10 +71,10 @@ class Instance extends HTMLElement {
 	}
 
 	set data (data) {
-		let instanceDiv = this.shadowElement.querySelector("div");
+		let instanceArticle = this.shadowElement.querySelector("article");
 
 		let instanceParagraph = document.createElement("p");
-		instanceParagraph.innerText = `CT | ${data.vmid} | ${data.name} | ${data.status}`;
+		instanceParagraph.innerText = `${data.type} | ${data.vmid} | ${data.name} | ${data.status}`;
 		instanceParagraph.style.color = data.status === "running" ? "#00ff00" : "#ff0000";
 		instanceDiv.append(instanceParagraph);
 	}