diff --git a/src/components/FileBrowser.vue b/src/components/FileBrowser.vue index 898a8811..e842d3bc 100644 --- a/src/components/FileBrowser.vue +++ b/src/components/FileBrowser.vue @@ -346,7 +346,7 @@ function stopDrag() { justify-content: center; background-color: transparent; cursor: col-resize; - inline-size: 4px; + inline-size: 1px; transition: background-color 0.2s ease; user-select: none; } diff --git a/src/components/dialog/ContentToggleSettingsDialog.vue b/src/components/dialog/ContentToggleSettingsDialog.vue index 696a0e4e..4782e786 100644 --- a/src/components/dialog/ContentToggleSettingsDialog.vue +++ b/src/components/dialog/ContentToggleSettingsDialog.vue @@ -109,7 +109,14 @@ function submitSettings() { + diff --git a/src/components/filebrowser/FileList.vue b/src/components/filebrowser/FileList.vue index c69ad4e2..faf890ff 100644 --- a/src/components/filebrowser/FileList.vue +++ b/src/components/filebrowser/FileList.vue @@ -29,8 +29,7 @@ const display = useDisplay() const { appMode } = usePWA() // 计算列表可用高度 -// componentOffset = FileToolbar(48) + FileList操作栏(40) + VCard边距(4) = 92 -const { availableHeight: listAvailableHeight } = useAvailableHeight(89, 300) +const { availableHeight: listAvailableHeight } = useAvailableHeight(100, 300) // 输入参数 const inProps = defineProps({ diff --git a/src/components/filebrowser/FileNavigator.vue b/src/components/filebrowser/FileNavigator.vue index 64a3dfa4..dc918b9a 100644 --- a/src/components/filebrowser/FileNavigator.vue +++ b/src/components/filebrowser/FileNavigator.vue @@ -4,7 +4,6 @@ import type { FileItem } from '@/api/types' import { useDisplay } from 'vuetify' import type { AxiosRequestConfig, AxiosInstance } from 'axios' import { useI18n } from 'vue-i18n' -import { usePWA } from '@/composables/usePWA' import { useAvailableHeight } from '@/composables/useAvailableHeight' // 国际化 @@ -12,16 +11,13 @@ const { t } = useI18n() const display = useDisplay() -const { appMode } = usePWA() - type TreeRow = | { type: 'root'; key: string; level: number } | { type: 'loading'; key: string; path: string; level: number } | { type: 'directory'; key: string; dir: FileItem; level: number } // 计算列表可用高度 -// componentOffset = FileToolbar(48) = 48 -const { availableHeight } = useAvailableHeight(48, 300) +const { availableHeight } = useAvailableHeight(58, 300) // 输入参数 const props = defineProps({ @@ -326,7 +322,6 @@ onMounted(async () => { flex-direction: column; flex-shrink: 0; border-radius: 0 !important; - background: rgb(var(--v-table-header-background)); block-size: 100%; box-shadow: none !important; inline-size: 240px; diff --git a/src/locales/en-US.ts b/src/locales/en-US.ts index b10dfb96..0b07cca8 100644 --- a/src/locales/en-US.ts +++ b/src/locales/en-US.ts @@ -2790,6 +2790,7 @@ export default { resubscribeTv: 'Resubscribing {name} Season {season}...', season: 'Season {season}', noData: 'No completed subscriptions', + noDataHint: 'Completed subscription history will be displayed here', }, siteUserData: { title: 'Site User Data', diff --git a/src/locales/zh-CN.ts b/src/locales/zh-CN.ts index e205f74e..b6df18ac 100644 --- a/src/locales/zh-CN.ts +++ b/src/locales/zh-CN.ts @@ -2740,6 +2740,7 @@ export default { resubscribeTv: '正在重新订阅 {name} 第 {season} 季...', season: '第 {season} 季', noData: '没有已完成的订阅', + noDataHint: '完成的订阅会显示在这里', }, siteUserData: { title: '站点用户数据', diff --git a/src/locales/zh-TW.ts b/src/locales/zh-TW.ts index db4aa8b2..9e17d9e4 100644 --- a/src/locales/zh-TW.ts +++ b/src/locales/zh-TW.ts @@ -2741,6 +2741,7 @@ export default { resubscribeTv: '正在重新訂閱 {name} 第 {season} 季...', season: '第 {season} 季', noData: '沒有已完成的訂閱', + noDataHint: '完成的訂閱會顯示在這裡', }, siteUserData: { title: '站點用戶數據', diff --git a/src/styles/common.scss b/src/styles/common.scss index afc0ca46..28918297 100644 --- a/src/styles/common.scss +++ b/src/styles/common.scss @@ -148,6 +148,15 @@ html[data-theme-shadow='high'] { transition: border-color 0.2s ease, border-radius 0.2s ease, box-shadow 0.2s ease; } +.app-surface-static { + border-radius: var(--app-surface-radius) !important; + box-shadow: var(--app-surface-shadow) !important; +} + +.app-surface-static:hover { + box-shadow: var(--app-surface-shadow) !important; +} + // 底部导航卡片原本就是胶囊形态，不参与主题圆角切换。 .footer-nav-card.v-card { --app-surface-radius: 9999px; @@ -183,21 +192,52 @@ html[data-theme-shadow='high'] { } // 统一文本输入、下拉框、文本域等有框表单控件的圆角，显式 rounded 控件保留特殊形态。 -.v-field:not(.v-field--variant-plain, .v-field--variant-underlined, .v-field--rounded, [class^='rounded-'], [class*=' rounded-']) { +.v-field:not( + .v-field--variant-plain, + .v-field--variant-underlined, + .v-field--rounded, + [class^='rounded-'], + [class*=' rounded-'] +) { border-radius: var(--app-field-radius); transition: border-radius 0.2s ease, box-shadow 0.2s ease; } -.v-btn:not(.v-btn--variant-plain, .v-btn--variant-text) { +// 自定义字段圆角时，outlined 字段带左侧 inner icon 需要同步放大左侧描边弧度。 +.v-field:not( + .v-field--variant-plain, + .v-field--variant-underlined, + .v-field--rounded, + [class^='rounded-'], + [class*=' rounded-'] +).v-field--variant-outlined.v-field--prepended { + --app-field-outline-start-size: max(12px, calc(var(--app-field-radius) + 8px)); + + .v-field__outline__start { + flex-basis: var(--app-field-outline-start-size); + } + + .v-field__outline__notch { + max-inline-size: calc(100% - var(--app-field-outline-start-size)); + } +} + +.v-btn:not(.v-btn--variant-plain, .v-btn--variant-text, .v-btn--flat) { box-shadow: var(--app-surface-shadow) !important; transition: box-shadow 0.2s ease; } -.v-btn:not(.v-btn--rounded, [class^='rounded-'], [class*=' rounded-']) { +.v-btn:not(.v-btn--rounded, .v-btn--flat, .v-btn--icon, [class^='rounded-'], [class*=' rounded-']) { border-radius: var(--app-surface-radius); transition: border-radius 0.2s ease; } +.v-btn-group:not(.v-btn-group--variant-plain, .v-btn-group--variant-text) { + border-radius: var(--app-surface-radius); + box-shadow: var(--app-surface-shadow) !important; + transition: box-shadow 0.2s ease, border-radius 0.2s ease; +} + // 只给外层 surface 加边框和阴影，卡片内部的列表、表格等子组件保持平面，避免层级噪声。 .v-card .v-list:not(.app-surface), .v-card .v-sheet:not(.app-surface), @@ -246,6 +286,7 @@ html[data-theme-skin='bordered'] { // 设置项强调卡片：复用通知模板入口的弱强调条、轻渐变与悬浮反馈。 .app-card-colorful { overflow: hidden; + border-radius: var(--app-surface-radius); background: linear-gradient( 135deg, @@ -254,8 +295,9 @@ html[data-theme-skin='bordered'] { rgba(var(--v-theme-surface), 0) 76% ), rgba(var(--v-theme-surface), var(--app-card-surface-opacity)); - box-shadow: var(--app-card-rest-shadow); + box-shadow: var(--app-surface-shadow); color: rgb(var(--v-theme-on-surface)); + transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease; --app-card-accent-rgb: var(--v-theme-primary); --app-card-accent-end-rgb: var(--app-card-accent-rgb); @@ -268,8 +310,6 @@ html[data-theme-skin='bordered'] { --app-surface-border: 1px solid rgba(var(--app-card-accent-rgb), var(--app-card-border-opacity)); --app-surface-hover-shadow: var(--app-card-hover-shadow); --app-surface-shadow: var(--app-card-rest-shadow); - - transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease; } .app-card-colorful::before { @@ -459,10 +499,11 @@ html[data-theme="transparent"] .app-card-colorful, padding-block: 4.5rem; padding-inline: 1rem; } +} - .Vue-Toastification__toast { - border-radius: 8px; - } +.Vue-Toastification__toast { + border-radius: var(--app-surface-radius); + box-shadow: var(--app-overlay-shadow); } // 对话框样式 @@ -623,11 +664,6 @@ html[data-theme="transparent"] .app-card-colorful, color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)); } -.Vue-Toastification__toast { - border-radius: var(--app-surface-radius); - box-shadow: var(--app-overlay-shadow); -} - .backdrop-blur { --tw-backdrop-blur: blur(8px)!important; @@ -794,7 +830,6 @@ html[data-theme="transparent"] .app-card-colorful, // 弹出层样式 .v-overlay__content .v-list{ - overflow: hidden; border-radius: var(--app-surface-radius); backdrop-filter: blur(6px); background-color: rgb(var(--v-theme-surface), 0.9); diff --git a/src/views/plugin/PluginCardListView.vue b/src/views/plugin/PluginCardListView.vue index 0db5cefc..0d46b45a 100644 --- a/src/views/plugin/PluginCardListView.vue +++ b/src/views/plugin/PluginCardListView.vue @@ -24,7 +24,9 @@ const route = useRoute() const Draggable = defineAsyncComponent(() => import('vuedraggable').then(module => module.default)) const PluginAppCard = defineAsyncComponent(() => import('@/components/cards/PluginAppCard.vue')) const PluginFolderCreateDialog = defineAsyncComponent(() => import('@/components/dialog/PluginFolderCreateDialog.vue')) -const PluginMarketSettingDialog = defineAsyncComponent(() => import('@/components/dialog/PluginMarketSettingDialog.vue')) +const PluginMarketSettingDialog = defineAsyncComponent( + () => import('@/components/dialog/PluginMarketSettingDialog.vue'), +) const ProgressDialog = defineAsyncComponent(() => import('@/components/dialog/ProgressDialog.vue')) const PluginSearchDialog = defineAsyncComponent(() => import('@/components/dialog/PluginSearchDialog.vue')) @@ -1643,8 +1645,8 @@ function onDragStartPlugin(evt: any) {
- -
+ +
{{ t('common.sortModeHint') }} {{ t('common.exit') }} diff --git a/src/views/reorganize/FileBrowserView.vue b/src/views/reorganize/FileBrowserView.vue index 765bb175..0b1cb86c 100644 --- a/src/views/reorganize/FileBrowserView.vue +++ b/src/views/reorganize/FileBrowserView.vue @@ -204,7 +204,7 @@ onMounted(loadDownloadDirectories)