update

app.py

@@ -63,7 +63,7 @@ observe_js = """
 		entries.forEach((entry) => {
 			const target = entry.target;
 			const newWidth = entry.contentRect.width;
-			target.style.setProperty("--channel-indicator-size", `${newWidth*0.025}px`);
+			target.style.setProperty("--indicator-size", `${newWidth*0.025}px`);
 		});
 	});
 	observer.observe(document.querySelector("#radio-group > div:nth-of-type(2)"));
@@ -86,7 +86,7 @@ init_js = """
 	}else return;
 	
 	const div = document.querySelector(selector);
-	div.style.setProperty("--channel-indicator-size", `${div.clientWidth*0.025}px`);
+	div.style.setProperty("--indicator-size", `${div.clientWidth*0.025}px`);
 	
 	// add figure of the input montage
 	div.style.cssText = `
@@ -112,8 +112,8 @@ init_js = """
 		el.querySelector(":scope > input").style.cssText = `
 			position: absolute;
 			z-index: 2;
-			width: var(--channel-indicator-size);
-			height: var(--channel-indicator-size);
+			width: var(--indicator-size);
+			height: var(--indicator-size);
 			transform: translate(-50%, -50%);
 		`;
 	});
@@ -128,8 +128,8 @@ init_js = """
 			position: absolute;
 			left: ${left}%;
 			bottom: ${bottom}%;
-			width: var(--channel-indicator-size);
-			height: var(--channel-indicator-size);
+			width: var(--indicator-size);
+			height: var(--indicator-size);
 			border-radius: 50%;
 			background-color: red;
 		}
@@ -195,8 +195,8 @@ update_js = """
 			position: absolute;
 			left: ${left}%;
 			bottom: ${bottom}%;
-			width: var(--channel-indicator-size);
-			height: var(--channel-indicator-size);
+			width: var(--indicator-size);
+			height: var(--indicator-size);
 			border-radius: 50%;
 			background-color: red;
 		}