GithubBackup/MoviePilot-Frontend
1
0
Fork 0
mirror of https://github.com/jxxghp/MoviePilot-Frontend.git synced 2026-08-27 11:10:12 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: add transparent theme support for AI agent settings card and adjust border opacity

Browse Source
This commit is contained in:
jxxghp
2026-04-25 12:30:30 +08:00
parent 6d1febd70a
commit b785769138
1 changed files with 14 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/views/setting/AccountSettingSystem.vue
View File

@@ -11,9 +11,12 @@ import { copyToClipboard } from '@/@core/utils/navigator'
import ProgressDialog from '@/components/dialog/ProgressDialog.vue' import ProgressDialog from '@/components/dialog/ProgressDialog.vue'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import { downloaderOptions, mediaServerOptions } from '@/api/constants' import { downloaderOptions, mediaServerOptions } from '@/api/constants'
import { useDisplay } from 'vuetify' import { useDisplay, useTheme } from 'vuetify'
const display = useDisplay() const display = useDisplay()
const theme = useTheme()
const isTransparentTheme = computed(() => theme.name.value === 'transparent')
// 国际化 // 国际化
const { t } = useI18n() const { t } = useI18n()
@@ -856,7 +859,10 @@ watch(currentLlmSnapshotKey, (snapshotKey, previousSnapshotKey) => {
/> />
</VCol> </VCol>
</VRow> </VRow>
<VCard variant="outlined" class="ai-agent-settings-card mt-6"> <VCard
variant="outlined"
:class="['mt-6', isTransparentTheme ? 'ai-agent-settings-card-transparent' : 'ai-agent-settings-card']"
>
<VCardItem class="pb-2"> <VCardItem class="pb-2">
<template #prepend> <template #prepend>
<VAvatar color="primary" variant="tonal" size="40"> <VAvatar color="primary" variant="tonal" size="40">
@@ -1731,10 +1737,15 @@ watch(currentLlmSnapshotKey, (snapshotKey, previousSnapshotKey) => {
<style scoped> <style scoped>
.ai-agent-settings-card { .ai-agent-settings-card {
border-color: rgba(var(--v-theme-primary), 0.01); border-color: rgba(var(--v-theme-primary), 0.15);
background: linear-gradient(180deg, rgba(var(--v-theme-primary), 0.04) 0%, rgba(var(--v-theme-surface), 0.92) 100%); background: linear-gradient(180deg, rgba(var(--v-theme-primary), 0.04) 0%, rgba(var(--v-theme-surface), 0.92) 100%);
} }
.ai-agent-settings-card-transparent {
border-color: rgba(var(--v-theme-primary), 0);
background-color: rgba(var(--v-theme-surface), 0) !important;
}
.setting-actions { .setting-actions {
display: flex; display: flex;
align-items: center; align-items: center;