From 8237e1ab164e5fb515b83c9b81c1612e1e019a93 Mon Sep 17 00:00:00 2001
From: ZigHolding <jianhanglan@163.com>
Date: Sat, 18 Jan 2025 12:23:06 +0800
Subject: [PATCH] move all styles into CSS

---
 src/gui/inputPrompt.ts | 12 ++++--------
 styles.css             | 13 +++++++++++++
 2 files changed, 17 insertions(+), 8 deletions(-)
 create mode 100644 styles.css

diff --git a/src/gui/inputPrompt.ts b/src/gui/inputPrompt.ts
index 3de1616..cb9b26a 100644
--- a/src/gui/inputPrompt.ts
+++ b/src/gui/inputPrompt.ts
@@ -70,8 +70,7 @@ export default class InputPrompt extends Modal {
 		value?: string
 	) {
 		const textComponent = new TextComponent(container);
-
-		(textComponent as any).inputEl.style.width = "100%";
+		(textComponent as any).inputEl.classList.add("input-field"); 
 		(textComponent as any)
 			.setPlaceholder(placeholder ?? "")
 			.setValue(value ?? "")
@@ -99,18 +98,15 @@ export default class InputPrompt extends Modal {
 			buttonBarContainer,
 			"Ok",
 			this.submitClickCallback
-		).setCta().buttonEl.style.marginRight = "0";
+		).setCta();
 		this.createButton(
 			buttonBarContainer,
 			"Cancel",
 			this.cancelClickCallback
 		);
 
-		buttonBarContainer.style.display = "flex";
-		buttonBarContainer.style.flexDirection = "row-reverse";
-		buttonBarContainer.style.justifyContent = "flex-start";
-		buttonBarContainer.style.marginTop = "1rem";
-		buttonBarContainer.style.gap = "0.5rem";
+		buttonBarContainer.classList.add("button-bar");
+		
 	}
 
 	private submitClickCallback = (evt: MouseEvent) => this.submit();
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000..05636c9
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,13 @@
+/* 按钮条样式 */
+.button-bar {
+    display: flex;
+    flex-direction: row-reverse;
+    justify-content: flex-start;
+    margin-top: 1rem;
+    gap: 0.5rem;
+}
+
+/* 输入字段样式 */
+.input-field {
+    width: 100%;
+}
\ No newline at end of file