Skip to content

Commit 1ed407d

Browse files
jasonczcjasonczc
committed
web: improve queue inline panel split visibility in settings
1 parent d8cc2f6 commit 1ed407d

3 files changed

Lines changed: 22 additions & 6 deletions

File tree

‎web/src/lib/locales/en.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -373,8 +373,11 @@ export default {
373373
'settings.behavior.queueInlinePanel': 'Queue Inline Panel',
374374
'settings.behavior.queueInlinePanel.description': 'Attach queue preview above the composer.',
375375
'settings.behavior.queueInlinePanel.off': 'Off',
376+
'settings.behavior.queueInlinePanel.off.description': 'Hide queue preview.',
376377
'settings.behavior.queueInlinePanel.compact': 'Compact',
378+
'settings.behavior.queueInlinePanel.compact.description': 'Show queue summary only.',
377379
'settings.behavior.queueInlinePanel.full': 'Full',
380+
'settings.behavior.queueInlinePanel.full.description': 'Show queue list with clearer split from composer content.',
378381
'settings.behavior.projectQuickCreate': 'Project + Quick Create',
379382
'settings.behavior.projectQuickCreate.description': 'Click project + to create immediately. Long-press or right-click opens detailed create.',
380383
'settings.behavior.briefCardAdaptive': 'Brief Card Adaptive Height',

‎web/src/lib/locales/zh-CN.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -375,8 +375,11 @@ export default {
375375
'settings.behavior.queueInlinePanel': '队列内联面板',
376376
'settings.behavior.queueInlinePanel.description': '在输入框上方显示队列预览。',
377377
'settings.behavior.queueInlinePanel.off': '关闭',
378+
'settings.behavior.queueInlinePanel.off.description': '不显示队列预览。',
378379
'settings.behavior.queueInlinePanel.compact': '紧凑',
380+
'settings.behavior.queueInlinePanel.compact.description': '仅显示队列摘要。',
379381
'settings.behavior.queueInlinePanel.full': '完整',
382+
'settings.behavior.queueInlinePanel.full.description': '展开工具并与输入内容分割显示。',
380383
'settings.behavior.projectQuickCreate': '项目 + 快速创建',
381384
'settings.behavior.projectQuickCreate.description': '点击项目 + 直接创建。长按或右键进入详细创建页。',
382385
'settings.behavior.briefCardAdaptive': 'Brief 卡片自适应高度',

‎web/src/routes/settings/index.tsx‎

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -253,6 +253,7 @@ export default function SettingsPage() {
253253
const currentFontScaleLabel = fontScaleOptions.find((opt) => opt.value === fontScale)?.label ?? '100%'
254254
const currentVoiceLanguage = voiceLanguages.find((lang) => lang.code === voiceLanguage)
255255
const currentQueuePanelLabel = t(`settings.behavior.queueInlinePanel.${queueInlinePanelMode}`)
256+
const currentQueuePanelModeDescription = t(`settings.behavior.queueInlinePanel.${queueInlinePanelMode}.description`)
256257
const currentImageCompressionLevelLabel = t(
257258
`settings.behavior.imageCompression.level.${imageUploadCompressionLevel}`
258259
)
@@ -894,7 +895,7 @@ export default function SettingsPage() {
894895
<div className="px-3 py-2 text-xs font-semibold text-[var(--app-hint)] uppercase tracking-wide">
895896
{t('settings.behavior.title')}
896897
</div>
897-
<div ref={queuePanelContainerRef} className="relative border-b border-[var(--app-divider)]">
898+
<div ref={queuePanelContainerRef} className="relative border-b border-[var(--app-border)]">
898899
<button
899900
type="button"
900901
onClick={() => setIsQueuePanelOpen(!isQueuePanelOpen)}
@@ -907,7 +908,7 @@ export default function SettingsPage() {
907908
{t('settings.behavior.queueInlinePanel')}
908909
</span>
909910
<span className="text-xs text-[var(--app-hint)]">
910-
{t('settings.behavior.queueInlinePanel.description')}
911+
{t('settings.behavior.queueInlinePanel.description')} · {currentQueuePanelModeDescription}
911912
</span>
912913
</div>
913914
<span className="flex items-center gap-1 text-[var(--app-hint)]">
@@ -918,7 +919,7 @@ export default function SettingsPage() {
918919

919920
{isQueuePanelOpen && (
920921
<div
921-
className="absolute right-3 top-full mt-1 min-w-[180px] rounded-lg border border-[var(--app-border)] bg-[var(--app-bg)] shadow-lg overflow-hidden z-50"
922+
className="absolute right-3 top-full mt-1 min-w-[220px] rounded-lg border border-[var(--app-border)] bg-[var(--app-bg)] shadow-lg overflow-hidden divide-y divide-[var(--app-divider)] z-50"
922923
role="listbox"
923924
aria-label={t('settings.behavior.queueInlinePanel')}
924925
>
@@ -931,15 +932,24 @@ export default function SettingsPage() {
931932
role="option"
932933
aria-selected={isSelected}
933934
onClick={() => handleQueuePanelModeChange(mode)}
934-
className={`flex items-center justify-between w-full px-3 py-2 text-base text-left transition-colors ${
935+
className={`flex w-full items-start justify-between gap-2 px-3 py-2 text-left transition-colors ${
935936
isSelected
936937
? 'text-[var(--app-link)] bg-[var(--app-subtle-bg)]'
937938
: 'text-[var(--app-fg)] hover:bg-[var(--app-subtle-bg)]'
938939
}`}
939940
>
940-
<span>{t(`settings.behavior.queueInlinePanel.${mode}`)}</span>
941+
<span className="flex min-w-0 flex-col">
942+
<span>{t(`settings.behavior.queueInlinePanel.${mode}`)}</span>
943+
<span
944+
className={`text-xs ${
945+
isSelected ? 'text-[var(--app-link)] opacity-80' : 'text-[var(--app-hint)]'
946+
}`}
947+
>
948+
{t(`settings.behavior.queueInlinePanel.${mode}.description`)}
949+
</span>
950+
</span>
941951
{isSelected && (
942-
<span className="ml-2 text-[var(--app-link)]">
952+
<span className="mt-0.5 shrink-0 text-[var(--app-link)]">
943953
<CheckIcon />
944954
</span>
945955
)}

0 commit comments

Comments
 (0)