refactor(settings): restructure settings modal with subsection headers

- Replace duplicate section headers with meaningful subsection titles
- Group settings under logical subsections using existing i18n keys
- Add new translation key 'settings.sections.apiConfiguration'
- Update CSS for subsection styling with proper visual hierarchy
- Improve UX by making settings organization clearer

Subsections now use familiar titles from existing translations:
- API Configuration, Storage Location, Language (General)
- Content Filtering, Video Settings, Layout Settings (Interface)
- Folder Settings, Download Path Templates, Priority Tags,
  Update Flags, Example Images (Download)
- Auto-organize Exclusions, Metadata Refresh Skip Paths (Organization)
- Metadata Archive, Misc (System)
- Proxy Settings (Network)
This commit is contained in:
Will Miao
2026-02-24 14:33:09 +08:00
parent 8d7e861458
commit de53ab9304
12 changed files with 742 additions and 632 deletions

View File

@@ -255,6 +255,7 @@
"clipboardFallback": "Einstellungspfad: {{path}}"
},
"sections": {
"apiConfiguration": "[TODO: Translate] API Configuration",
"contentFiltering": "Inhaltsfilterung",
"videoSettings": "Video-Einstellungen",
"layoutSettings": "Layout-Einstellungen",

View File

@@ -255,6 +255,7 @@
"clipboardFallback": "Settings path: {{path}}"
},
"sections": {
"apiConfiguration": "API Configuration",
"contentFiltering": "Content Filtering",
"videoSettings": "Video Settings",
"layoutSettings": "Layout Settings",

View File

@@ -255,6 +255,7 @@
"clipboardFallback": "Ruta de configuración: {{path}}"
},
"sections": {
"apiConfiguration": "[TODO: Translate] API Configuration",
"contentFiltering": "Filtrado de contenido",
"videoSettings": "Configuración de video",
"layoutSettings": "Configuración de diseño",

View File

@@ -255,6 +255,7 @@
"clipboardFallback": "Chemin des paramètres: {{path}}"
},
"sections": {
"apiConfiguration": "[TODO: Translate] API Configuration",
"contentFiltering": "Filtrage du contenu",
"videoSettings": "Paramètres vidéo",
"layoutSettings": "Paramètres d'affichage",

View File

@@ -255,6 +255,7 @@
"clipboardFallback": "נתיב ההגדרות: {{path}}"
},
"sections": {
"apiConfiguration": "[TODO: Translate] API Configuration",
"contentFiltering": "סינון תוכן",
"videoSettings": "הגדרות וידאו",
"layoutSettings": "הגדרות פריסה",

View File

@@ -255,6 +255,7 @@
"clipboardFallback": "設定パス: {{path}}"
},
"sections": {
"apiConfiguration": "[TODO: Translate] API Configuration",
"contentFiltering": "コンテンツフィルタリング",
"videoSettings": "動画設定",
"layoutSettings": "レイアウト設定",

View File

@@ -255,6 +255,7 @@
"clipboardFallback": "설정 경로: {{path}}"
},
"sections": {
"apiConfiguration": "[TODO: Translate] API Configuration",
"contentFiltering": "콘텐츠 필터링",
"videoSettings": "비디오 설정",
"layoutSettings": "레이아웃 설정",

View File

@@ -255,6 +255,7 @@
"clipboardFallback": "Путь настроек: {{path}}"
},
"sections": {
"apiConfiguration": "[TODO: Translate] API Configuration",
"contentFiltering": "Фильтрация контента",
"videoSettings": "Настройки видео",
"layoutSettings": "Настройки макета",

View File

@@ -255,6 +255,7 @@
"clipboardFallback": "设置路径:{{path}}"
},
"sections": {
"apiConfiguration": "[TODO: Translate] API Configuration",
"contentFiltering": "内容过滤",
"videoSettings": "视频设置",
"layoutSettings": "布局设置",

View File

@@ -255,6 +255,7 @@
"clipboardFallback": "設定路徑:{{path}}"
},
"sections": {
"apiConfiguration": "[TODO: Translate] API Configuration",
"contentFiltering": "內容過濾",
"videoSettings": "影片設定",
"layoutSettings": "版面設定",

View File

@@ -573,20 +573,34 @@
}
}
/* Remove old section header - replaced by subsection headers */
.settings-section-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 0 var(--space-2) 0;
margin-bottom: var(--space-3);
border-bottom: 2px solid var(--lora-accent);
display: none;
}
.settings-section-header h3 {
font-size: 20px;
/* Subsection styling */
.settings-subsection {
margin-bottom: var(--space-4);
}
.settings-subsection:last-child {
margin-bottom: 0;
}
.settings-subsection-header {
display: flex;
align-items: center;
padding: var(--space-2) 0;
margin-bottom: var(--space-2);
border-bottom: 1px solid var(--lora-border);
}
.settings-subsection-header h4 {
font-size: 16px;
font-weight: 600;
margin: 0;
color: var(--text-color);
opacity: 0.9;
}
/* Remove toggle button styles */
@@ -598,10 +612,14 @@
display: flex;
flex-direction: column; /* Changed to column for help text placement */
margin-bottom: var(--space-3); /* Increased to provide more spacing between items */
padding: var(--space-1);
padding: var(--space-2);
border-radius: var(--border-radius-xs);
}
.setting-item:last-child {
margin-bottom: 0;
}
.setting-item:hover {
background: rgba(0, 0, 0, 0.02);
}
@@ -610,6 +628,32 @@
background: rgba(255, 255, 255, 0.05);
}
/* Subsection styling */
.settings-subsection {
margin-bottom: var(--space-5);
}
.settings-subsection:last-child {
margin-bottom: 0;
}
.settings-subsection-header {
display: flex;
align-items: center;
padding: var(--space-2) var(--space-2) var(--space-2) 0;
margin-bottom: var(--space-2);
border-bottom: 1px solid var(--lora-border);
}
.settings-subsection-header h4 {
font-size: 15px;
font-weight: 600;
margin: 0;
color: var(--text-color);
opacity: 0.85;
letter-spacing: 0.3px;
}
/* Control row with label and input together */
.setting-row {
display: flex;

File diff suppressed because it is too large Load Diff