From f830496a23674522d5398d75ce85adde790a7a15 Mon Sep 17 00:00:00 2001
From: "Angnuo Li (from Dev Box)" <angnuoli@gmail.com>
Date: Tue, 4 Aug 2026 14:21:17 +0800
Subject: [PATCH 1/2] fix(renderer): make language selector accessible

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
---
 .../views/SettingsView.accessibility.test.ts  | 15 +++++++
 desktop/renderer/src/views/SettingsView.vue   | 40 ++++++++++++++++---
 2 files changed, 50 insertions(+), 5 deletions(-)
 create mode 100644 desktop/renderer/src/views/SettingsView.accessibility.test.ts

diff --git a/desktop/renderer/src/views/SettingsView.accessibility.test.ts b/desktop/renderer/src/views/SettingsView.accessibility.test.ts
new file mode 100644
index 0000000..019cb53
--- /dev/null
+++ b/desktop/renderer/src/views/SettingsView.accessibility.test.ts
@@ -0,0 +1,15 @@
+import { describe, expect, it } from "vitest";
+import settingsViewSource from "./SettingsView.vue?raw";
+
+describe("Settings language selector accessibility", () => {
+  it("uses a labelled native select for platform accessibility APIs", () => {
+    expect(settingsViewSource).toContain(
+      '<label class="row-label" for="settings-language-select">',
+    );
+    expect(settingsViewSource).toContain('<select\n              id="settings-language-select"');
+    expect(settingsViewSource).toContain(':aria-label="t(\'settings.language\')"');
+    expect(settingsViewSource).not.toMatch(
+      /<el-select[^>]*v-model="settings\.language"[^>]*>/s,
+    );
+  });
+});
diff --git a/desktop/renderer/src/views/SettingsView.vue b/desktop/renderer/src/views/SettingsView.vue
index 42c5acc..727ef03 100644
--- a/desktop/renderer/src/views/SettingsView.vue
+++ b/desktop/renderer/src/views/SettingsView.vue
@@ -26,11 +26,18 @@
         <div class="section-label">{{ t("settings.application") }}</div>
         <div class="card-group">
           <div class="card-row">
-            <span class="row-label">{{ t("settings.language") }}</span>
-            <el-select v-model="settings.language" style="width: 140px">
-              <el-option label="简体中文" value="zh-CN" />
-              <el-option label="English" value="en-US" />
-            </el-select>
+            <label class="row-label" for="settings-language-select">
+              {{ t("settings.language") }}
+            </label>
+            <select
+              id="settings-language-select"
+              v-model="settings.language"
+              class="language-select"
+              :aria-label="t('settings.language')"
+            >
+              <option value="zh-CN">简体中文</option>
+              <option value="en-US">English</option>
+            </select>
           </div>
           <div class="card-row">
             <span class="row-label">{{ t("settings.autoStart") }}</span>
@@ -2060,6 +2067,29 @@ async function clearChatHistory() {
   min-width: 0;
 }
 
+.language-select {
+  width: 140px;
+  height: 32px;
+  flex-shrink: 0;
+  padding: 0 10px;
+  border: 1px solid var(--border-strong);
+  border-radius: 8px;
+  background: var(--bg-input);
+  color: var(--text-primary);
+  font: inherit;
+  font-size: 13px;
+  cursor: pointer;
+}
+
+.language-select:hover {
+  border-color: var(--text-muted);
+}
+
+.language-select:focus-visible {
+  outline: 2px solid var(--accent);
+  outline-offset: 2px;
+}
+
 .row-value {
   font-size: 13px;
   font-weight: 400;

From e5f2b3df54b505b180facb52fbd979987363cbea Mon Sep 17 00:00:00 2001
From: "Angnuo Li (from Dev Box)" <angnuoli@gmail.com>
Date: Tue, 4 Aug 2026 16:52:46 +0800
Subject: [PATCH 2/2] chore: keep language selector PR focused

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
---
 .../src/views/SettingsView.accessibility.test.ts  | 15 ---------------
 1 file changed, 15 deletions(-)
 delete mode 100644 desktop/renderer/src/views/SettingsView.accessibility.test.ts

diff --git a/desktop/renderer/src/views/SettingsView.accessibility.test.ts b/desktop/renderer/src/views/SettingsView.accessibility.test.ts
deleted file mode 100644
index 019cb53..0000000
--- a/desktop/renderer/src/views/SettingsView.accessibility.test.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { describe, expect, it } from "vitest";
-import settingsViewSource from "./SettingsView.vue?raw";
-
-describe("Settings language selector accessibility", () => {
-  it("uses a labelled native select for platform accessibility APIs", () => {
-    expect(settingsViewSource).toContain(
-      '<label class="row-label" for="settings-language-select">',
-    );
-    expect(settingsViewSource).toContain('<select\n              id="settings-language-select"');
-    expect(settingsViewSource).toContain(':aria-label="t(\'settings.language\')"');
-    expect(settingsViewSource).not.toMatch(
-      /<el-select[^>]*v-model="settings\.language"[^>]*>/s,
-    );
-  });
-});