diff --git a/scripts/elements.js b/scripts/elements.js
index 7570777..ac195da 100644
--- a/scripts/elements.js
+++ b/scripts/elements.js
@@ -8,6 +8,8 @@ class Instance extends HTMLElement {
 		let shadowRoot = this.attachShadow({mode: "open"});
 
 		shadowRoot.innerHTML = `
+		<link rel="stylesheet" href="css/style.css" type="text/css">
+		<link rel="stylesheet" href="css/instance.css" type="text/css">
 		<article>
 			<div>
 				<div>
@@ -28,18 +30,6 @@ class Instance extends HTMLElement {
 		</article>
 		`;
 
-		let styleLink = document.createElement("link");
-		styleLink.rel = "stylesheet";
-		styleLink.href = "css/style.css";
-		styleLink.type = "text/css";
-		shadowRoot.append(styleLink);
-
-		let instanceLink = document.createElement("link");
-		instanceLink.rel = "stylesheet";
-		instanceLink.href = "css/instance.css";
-		instanceLink.type = "text/css";
-		shadowRoot.append(instanceLink);
-
 		this.shadowElement = shadowRoot;
 		this.actionLock = false;
 	}
@@ -81,11 +71,7 @@ class Instance extends HTMLElement {
 		let configButton = this.shadowElement.querySelector("#configure-btn");
 		configButton.src = instances[this.status].configButtonSrc;
 		configButton.alt = instances[this.status].configButtonAlt;
-		configButton.addEventListener("click", () => {
-			if (!this.actionLock && this.status !== "running") {
-				goToPage("config.html", {node: this.node.name, type: this.type, vmid: this.vmid});
-			}
-		});
+		configButton.addEventListener("click", this.handleConfigButton.bind(this));
 
 		if (this.node.status !== "online") {
 			powerButton.classList.add("hidden");
@@ -131,12 +117,18 @@ class Instance extends HTMLElement {
 					this.actionLock = false;
 					return;
 				}
-				else{
+				else{ // task has not stopped
 					await waitFor(1000);
 				}
 			}
 		}
 	}
+
+	handleConfigButton () {
+		if (!this.actionLock && this.status === "stopped") { // if the action lock is false, and the node is stopped, then navigate to the conig page with the node infor in the search query
+			goToPage("config.html", {node: this.node.name, type: this.type, vmid: this.vmid});
+		}
+	}
 }
 
 customElements.define("instance-article", Instance);
\ No newline at end of file
diff --git a/scripts/utils.js b/scripts/utils.js
index 7c7dd4b..a0f4efb 100644
--- a/scripts/utils.js
+++ b/scripts/utils.js
@@ -1,4 +1,4 @@
-import {pveAPI, paasAPI} from "/vars.js";
+import {PVE, API} from "/vars.js";
 
 export class ResponseError extends Error {
 	constructor(message) {
@@ -98,7 +98,7 @@ export async function requestPVE (path, method, body = null) {
 		content.headers.CSRFPreventionToken = getCookie("CSRFPreventionToken");
 	}
 
-	let response = await request(`${pveAPI}${path}`, content);
+	let response = await request(`${PVE}${path}`, content);
 	return response;
 }
 
@@ -117,7 +117,7 @@ export async function requestAPI (path, method, body = null) {
 		content.headers.CSRFPreventionToken = getCookie("CSRFPreventionToken");
 	}
 
-	let response = await request(`${paasAPI}${path}`, content);
+	let response = await request(`${API}${path}`, content);
 	return response;
 }
 
diff --git a/vars.js.template b/vars.js.template
index 0df047c..d5e7f7d 100644
--- a/vars.js.template
+++ b/vars.js.template
@@ -1,2 +1,2 @@
-export const pveAPI = "";
-export const paasAPI = ""
\ No newline at end of file
+export const PVE = ""; // the proxmox web api
+export const API = ""; // the proxmox-aas api
\ No newline at end of file