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

Disable transitions that disrupt glass theme rendering

Browse Source
This commit is contained in:
jxxghp
2026-07-22 22:13:13 +08:00
parent 0315481eb6
commit d2896d5936
1 changed files with 46 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
src/styles/themes/glass.scss
View File

@@ -121,6 +121,49 @@ html[data-theme='glass'] {
z-index: 1;
}
// 玻璃表面依赖稳定的背景采样层；入场透明度、位移或滤镜会让浏览器在动画结束后才重建材质。
:where(
.mp-page-route--entering,
.mp-page-enter-active,
.mp-page-leave-active,
.fade-enter-active,
.fade-leave-active,
.fade-slide-enter-active,
.fade-slide-leave-active,
.fade-transition-enter-active,
.fade-transition-leave-active
) {
animation: none !important;
transition: none !important;
will-change: auto !important;
}
:where(
.mp-page-enter-from,
.mp-page-leave-to,
.fade-enter-from,
.fade-leave-to,
.fade-slide-enter-from,
.fade-slide-leave-to,
.fade-transition-enter-from,
.fade-transition-leave-to
) {
filter: none !important;
opacity: 1 !important;
transform: none !important;
}
// Overlay 的过渡类挂在玻璃表面的父层上，统一保持最终合成状态可覆盖菜单、选择器和弹窗。
.v-overlay__content[class*='-transition-enter-'],
.v-overlay__content[class*='-transition-leave-'] {
animation: none !important;
filter: none !important;
opacity: 1 !important;
transform: none !important;
transition: none !important;
will-change: auto !important;
}
:where(
.app-surface:not(.no-blur),
.v-card:not(.no-blur, .bg-primary, .bg-success, .bg-info, .bg-warning, .bg-error),
@@ -211,8 +254,7 @@ html[data-theme='glass'] {
:where(.theme-customizer-border-scene, .theme-customizer-radius-scene) {
border-color: var(--glass-border) !important;
background:
linear-gradient(180deg, rgba(255, 255, 255, 4%), rgba(255, 255, 255, 7%)),
rgba(255, 255, 255, 3%) !important;
linear-gradient(180deg, rgba(255, 255, 255, 4%), rgba(255, 255, 255, 7%)), rgba(255, 255, 255, 3%) !important;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 12%),
inset 0 -1px 0 rgba(2, 6, 16, 18%);
@@ -231,8 +273,7 @@ html[data-theme='glass'] {
inset 0 -1px 0 rgba(2, 6, 16, 20%);
}
.theme-customizer-preview-option.is-active
> :where(.theme-customizer-border-scene, .theme-customizer-radius-scene) {
.theme-customizer-preview-option.is-active > :where(.theme-customizer-border-scene, .theme-customizer-radius-scene) {
border-color: rgb(var(--v-theme-primary)) !important;
background: rgba(var(--v-theme-primary), 8%) !important;
}
@@ -470,8 +511,7 @@ html[data-theme='glass'] {
--slider-shadow-bleed-inline: 32px;
}
:where(.v-card, .v-sheet)
:where(.app-surface, .v-card, .v-sheet, .v-list, .v-table, .v-expansion-panel, .v-stepper) {
:where(.v-card, .v-sheet) :where(.app-surface, .v-card, .v-sheet, .v-list, .v-table, .v-expansion-panel, .v-stepper) {
border-color: transparent !important;
-webkit-backdrop-filter: none;
backdrop-filter: none;