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

feat: 移除多个组件的背景颜色以优化样式

Browse Source
This commit is contained in:
jxxghp
2025-04-09 21:31:57 +08:00
parent 2ba609fb78
commit 3205ae3ebe
9 changed files with 21 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/cards/TorrentItem.vue
View File

@@ -194,7 +194,6 @@ onMounted(() => {
.torrent-item {
padding: 12px;
background-color: rgb(var(--v-theme-surface));
box-shadow: none;
margin-block-end: 8px;
transition: background-color 0.2s ease, transform 0.2s ease;

2
src/components/cards/UserCard.vue
View File

@@ -282,7 +282,6 @@ onUnmounted(() => {
.user-card {
position: relative;
overflow: hidden;
background: rgb(var(--v-theme-surface));
transition: all 0.3s ease;
}
@@ -341,7 +340,6 @@ onUnmounted(() => {
justify-content: center;
border: 1px solid rgba(var(--v-theme-warning), 0.5);
border-radius: 50%;
background: rgb(var(--v-theme-surface));
block-size: 18px;
inline-size: 18px;
margin-block: 0;

1
src/components/dialog/SearchBarDialog.vue
View File

@@ -843,7 +843,6 @@ onMounted(() => {
.site-search-card {
border: 1px solid rgba(var(--v-theme-on-surface), 0.08);
border-radius: 14px;
background-color: rgb(var(--v-theme-surface));
}
.site-chip {

1
src/layouts/components/ShortcutBar.vue
View File

@@ -389,7 +389,6 @@ onMounted(() => {
padding: 16px;
border: 1px solid rgba(var(--v-theme-on-surface), 0.05);
border-radius: 12px;
background-color: rgba(var(--v-theme-surface));
cursor: pointer;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

2
src/layouts/components/UserProfile.vue
View File

@@ -86,7 +86,7 @@ const userLevel = computed(() => userStore.level)
<VImg :src="avatar" />
<VMenu activator="parent" width="230" location="bottom end" offset="14px" class="user-menu">
<VList class="overflow-hidden">
<VList class="overflow-hidden pt-0">
<!-- 👉 User Avatar & Name -->
<div class="user-profile-header px-2 py-4 mb-2">
<div class="d-flex align-center">

3
src/pages/resource.vue
View File

@@ -291,7 +291,6 @@ onUnmounted(() => {
border: 1px solid rgba(var(--v-theme-primary), 0.1);
border-radius: 12px;
backdrop-filter: blur(10px);
background-color: rgb(var(--v-theme-surface));
box-shadow: 0 8px 24px rgba(0, 0, 0, 12%);
inline-size: 90%;
max-inline-size: 400px;
@@ -346,7 +345,6 @@ onUnmounted(() => {
/* 精简标题栏样式 */
.search-header {
border: 1px solid rgba(var(--v-theme-on-surface), 0.08);
background-color: rgb(var(--v-theme-surface));
box-shadow: 0 2px 8px rgba(0, 0, 0, 5%);
padding-block: 12px;
padding-inline: 16px;
@@ -395,7 +393,6 @@ onUnmounted(() => {
}
.view-toggle-btn.active {
background-color: rgb(var(--v-theme-surface));
box-shadow: 0 2px 4px rgba(0, 0, 0, 10%);
}

38
src/styles/styles.scss
View File

@@ -134,7 +134,6 @@ html.v-overlay-scroll-blocked body {
.backdrop-blur {
--tw-backdrop-blur: blur(8px)!important;
backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)!important;
}
@@ -262,10 +261,25 @@ html.v-overlay-scroll-blocked body {
inset: 0;
}
.v-list-item {
margin-block: 2px !important;
margin-inline: 0 !important;
transition: background-color 0.15s ease;
.v-overlay__content .v-list{
/* stylelint-disable-next-line property-no-vendor-prefix */
-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
background-color: rgb(var(--v-theme-surface), 0.9) !important;
}
.v-overlay__content .v-card:not(.bg-primary){
/* stylelint-disable-next-line property-no-vendor-prefix */
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
background-color: rgb(var(--v-theme-surface), 0.95) !important;
.v-list, .v-table {
/* stylelint-disable-next-line property-no-vendor-prefix */
-webkit-backdrop-filter: none;
backdrop-filter: none;
background-color: transparent !important;
}
}
.v-list-item:hover {
@@ -285,20 +299,6 @@ html.v-overlay-scroll-blocked body {
transition: opacity 0.2s ease !important;
}
.v-overlay__content .v-list{
padding: 0;
margin: 0 !important;
background-color: rgb(var(--v-theme-surface)) !important;
}
.v-overlay__content .v-card:not(.bg-primary){
background-color: rgb(var(--v-theme-surface)) !important;
.v-list, .v-table {
background-color: transparent !important;
}
}
.v-menu > .v-overlay__content {
overflow: hidden;
}

3
src/views/torrent/TorrentCardListView.vue
View File

@@ -380,7 +380,7 @@ function removeFilter(key: string, value: string) {
function loadMore({ done }: { done: any }) {
// 从 dataList 中获取最前面的 20 个元素
const itemsToMove = dataList.splice(0, 20)
const itemsToMove = dataList.splice(0, 20)
displayDataList.value.push(...itemsToMove)
done('ok')
}
@@ -624,7 +624,6 @@ function loadMore({ done }: { done: any }) {
.view-header {
overflow: hidden;
border: 1px solid rgba(var(--v-theme-on-surface), 0.08);
background-color: rgb(var(--v-theme-surface));
}
.sort-container {

2
src/views/torrent/TorrentRowListView.vue
View File

@@ -615,7 +615,6 @@ function loadMore({ done }: { done: any }) {
.view-header {
overflow: hidden;
border: 1px solid rgba(var(--v-theme-on-surface), 0.08);
background-color: rgb(var(--v-theme-surface));
box-shadow: none;
}
@@ -704,7 +703,6 @@ function loadMore({ done }: { done: any }) {
padding: 8px;
border: 1px solid rgba(var(--v-theme-on-surface), 0.08);
border-radius: 12px;
background-color: rgb(var(--v-theme-surface));
}
.resource-list {