mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-09-05 23:56:42 +08:00
优化 PluginCard 组件的样式,移除不必要的 card-backdrop 和 card-backdrop-blur 类,简化背景颜色设置,提升视觉效果和代码可维护性。
This commit is contained in:
@@ -340,12 +340,12 @@ watch(
|
|||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
class="relative flex flex-row items-start pa-3 justify-between grow card-backdrop"
|
class="relative flex flex-row items-start pa-3 justify-between grow"
|
||||||
:style="{ '--base-color': backgroundColor }"
|
:style="{ background: `${backgroundColor}` }"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
class="absolute inset-0 bg-cover bg-center card-backdrop-blur"
|
class="absolute inset-0 bg-cover bg-center"
|
||||||
:style="{ '--base-color': backgroundColor }"
|
:style="{ background: `${backgroundColor}`, filter: 'brightness(0.5)' }"
|
||||||
/>
|
/>
|
||||||
<div class="relative flex-1 min-w-0">
|
<div class="relative flex-1 min-w-0">
|
||||||
<VCardTitle class="text-white text-lg px-2 text-shadow whitespace-nowrap overflow-hidden text-ellipsis">
|
<VCardTitle class="text-white text-lg px-2 text-shadow whitespace-nowrap overflow-hidden text-ellipsis">
|
||||||
@@ -466,33 +466,6 @@ watch(
|
|||||||
inset: 0;
|
inset: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card-backdrop {
|
|
||||||
background: rgba(var(--v-theme-primary), 0.2);
|
|
||||||
|
|
||||||
&::before {
|
|
||||||
position: absolute;
|
|
||||||
background: color-mix(in srgb, var(--base-color) 60%, transparent);
|
|
||||||
content: '';
|
|
||||||
inset: 0;
|
|
||||||
opacity: 0.8;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.card-backdrop-blur {
|
|
||||||
/* stylelint-disable-next-line property-no-vendor-prefix */
|
|
||||||
-webkit-backdrop-filter: blur(10px);
|
|
||||||
backdrop-filter: blur(10px);
|
|
||||||
background: transparent;
|
|
||||||
|
|
||||||
&::before {
|
|
||||||
position: absolute;
|
|
||||||
background: color-mix(in srgb, var(--base-color) 30%, transparent);
|
|
||||||
content: '';
|
|
||||||
inset: 0;
|
|
||||||
opacity: 0.7;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.author-info {
|
.author-info {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|||||||
Reference in New Issue
Block a user