MCP/mcp-feedback-enhanced
1
0
Fork 0
mirror of https://github.com/Minidoracat/mcp-feedback-enhanced.git synced 2025-07-27 10:42:25 +08:00
Code Issues Packages Projects Releases Wiki Activity

🎨 修改語系選擇的樣式

Browse Source
This commit is contained in:
Minidoracat 2025-06-13 14:32:45 +08:00
parent dfd75282c7
commit 7dc9aa510a
4 changed files with 61 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/mcp_feedback_enhanced/web/static/css/styles.css
View File

@ -617,7 +617,7 @@ body {
background: rgba(0, 122, 204, 0.15);
}
/* 語言選擇器現代化樣式 */
/* 語言選擇器現代化樣式 - 保留用於兼容性 */
.language-selector-modern {
display: flex;
align-items: center;
@ -668,6 +668,35 @@ body {
color: white;
}
/* 語言選擇器下拉選單樣式 */
.language-selector-dropdown {
display: flex;
align-items: center;
gap: 10px;
}
.language-setting-select {
background: var(--bg-primary);
color: var(--text-primary);
border: 1px solid var(--border-color);
border-radius: 4px;
padding: 8px 12px;
font-size: 14px;
min-width: 140px;
transition: border-color 0.3s ease;
cursor: pointer;
}
.language-setting-select:focus {
outline: none;
border-color: var(--accent-color);
box-shadow: 0 0 0 2px rgba(0, 122, 204, 0.2);
}
.language-setting-select:hover {
border-color: var(--accent-color);
}
/* 表單元素樣式 */
.input-group {
margin-bottom: 20px;

10
src/mcp_feedback_enhanced/web/static/js/i18n.js
View File

@ -265,14 +265,18 @@ class I18nManager {
}
setupLanguageSelectors() {
// 舊版下拉選擇器（兼容性保留）
// 設定頁籤的下拉選擇器
const selector = document.getElementById('settingsLanguageSelect');
if (selector) {
// 設置當前值
selector.value = this.currentLanguage;
// 移除舊的事件監聽器（避免重複綁定）
const newSelector = selector.cloneNode(true);
selector.parentNode.replaceChild(newSelector, selector);
// 添加事件監聽器
selector.addEventListener('change', (e) => {
newSelector.addEventListener('change', (e) => {
this.setLanguage(e.target.value);
});
}

21
src/mcp_feedback_enhanced/web/static/js/modules/settings-manager.js
View File

@ -351,8 +351,14 @@
window.i18nManager.setLanguage(this.currentSettings.language);
}
}
// 更新語言選項顯示
// 更新下拉選單選項
const languageSelect = Utils.safeQuerySelector('#settingsLanguageSelect');
if (languageSelect) {
languageSelect.value = this.currentSettings.language;
}
// 更新語言選項顯示（兼容舊版卡片式選擇器）
const languageOptions = document.querySelectorAll('.language-option');
languageOptions.forEach(function(option) {
option.classList.toggle('active', option.getAttribute('data-lang') === this.currentSettings.language);
@ -400,7 +406,16 @@
});
}
// 語言切換
// 語言切換 - 支援下拉選單
const languageSelect = Utils.safeQuerySelector('#settingsLanguageSelect');
if (languageSelect) {
languageSelect.addEventListener('change', function(e) {
const lang = e.target.value;
self.set('language', lang);
});
}
// 語言切換 - 兼容舊版卡片式選擇器
const languageOptions = document.querySelectorAll('.language-option');
languageOptions.forEach(function(option) {
option.addEventListener('click', function() {

21
src/mcp_feedback_enhanced/web/templates/feedback.html
View File

@ -732,21 +732,12 @@
選擇界面顯示語言
</div>
</div>
<div class="language-selector-modern">
<div class="language-options">
<div class="language-option" data-lang="zh-TW">
<div class="language-flag">🌏</div>
<div class="language-name">繁體中文</div>
</div>
<div class="language-option" data-lang="zh-CN">
<div class="language-flag">🌍</div>
<div class="language-name">简体中文</div>
</div>
<div class="language-option" data-lang="en">
<div class="language-flag">🌎</div>
<div class="language-name">English</div>
</div>
</div>
<div class="language-selector-dropdown">
<select id="settingsLanguageSelect" class="language-setting-select">
<option value="zh-TW" data-i18n="languages.zh-TW">繁體中文</option>
<option value="zh-CN" data-i18n="languages.zh-CN">简体中文</option>
<option value="en" data-i18n="languages.en">English</option>
</select>
</div>
</div>
</div>