Use overlay shadow for pull indicator

This commit is contained in:
jxxghp
2026-06-30 18:03:32 +08:00
parent da630b0966
commit 3547c146a8
+1 -5
View File
@@ -1542,7 +1542,7 @@ html[data-theme="transparent"].transparent-glass-realtime .v-theme--transparent
border-radius: 50%; border-radius: 50%;
backdrop-filter: blur(var(--app-pull-indicator-blur)) saturate(1.2); backdrop-filter: blur(var(--app-pull-indicator-blur)) saturate(1.2);
background: rgba(var(--v-theme-surface), var(--app-pull-indicator-surface-opacity)); background: rgba(var(--v-theme-surface), var(--app-pull-indicator-surface-opacity));
box-shadow: var(--app-pull-indicator-shadow); box-shadow: var(--app-overlay-shadow);
inset-block-start: calc( inset-block-start: calc(
env(safe-area-inset-top, 0px) + 4rem + var(--app-pull-indicator-navbar-extra-height, 0rem) + 0.75rem env(safe-area-inset-top, 0px) + 4rem + var(--app-pull-indicator-navbar-extra-height, 0rem) + 0.75rem
); );
@@ -1557,7 +1557,6 @@ html[data-theme="transparent"].transparent-glass-realtime .v-theme--transparent
--app-pull-indicator-blur: 20px; --app-pull-indicator-blur: 20px;
--app-pull-indicator-border-opacity: 0.12; --app-pull-indicator-border-opacity: 0.12;
--app-pull-indicator-icon-surface-opacity: 0.1; --app-pull-indicator-icon-surface-opacity: 0.1;
--app-pull-indicator-shadow: 0 8px 24px rgba(0, 0, 0, 12%), 0 2px 8px rgba(0, 0, 0, 8%);
--app-pull-indicator-surface-opacity: 0.86; --app-pull-indicator-surface-opacity: 0.86;
} }
@@ -1575,7 +1574,6 @@ html[data-theme="transparent"].transparent-glass-realtime .v-theme--transparent
html[data-theme='light'] .app-pull-indicator { html[data-theme='light'] .app-pull-indicator {
--app-pull-indicator-border-opacity: 0.1; --app-pull-indicator-border-opacity: 0.1;
--app-pull-indicator-icon-surface-opacity: 0.1; --app-pull-indicator-icon-surface-opacity: 0.1;
--app-pull-indicator-shadow: 0 8px 24px rgba(58, 53, 65, 10%), 0 2px 8px rgba(58, 53, 65, 6%);
--app-pull-indicator-surface-opacity: 0.92; --app-pull-indicator-surface-opacity: 0.92;
} }
@@ -1583,7 +1581,6 @@ html[data-theme='dark'] .app-pull-indicator,
html[data-theme='purple'] .app-pull-indicator { html[data-theme='purple'] .app-pull-indicator {
--app-pull-indicator-border-opacity: 0.14; --app-pull-indicator-border-opacity: 0.14;
--app-pull-indicator-icon-surface-opacity: 0.16; --app-pull-indicator-icon-surface-opacity: 0.16;
--app-pull-indicator-shadow: 0 10px 30px rgba(0, 0, 0, 32%), 0 3px 12px rgba(0, 0, 0, 22%);
--app-pull-indicator-surface-opacity: 0.78; --app-pull-indicator-surface-opacity: 0.78;
} }
@@ -1592,7 +1589,6 @@ html[data-theme='transparent'] .app-pull-indicator {
--app-pull-indicator-border-opacity: 0.14; --app-pull-indicator-border-opacity: 0.14;
--app-pull-indicator-icon-surface-opacity: 0.18; --app-pull-indicator-icon-surface-opacity: 0.18;
--app-pull-indicator-shadow: 0 10px 32px rgba(0, 0, 0, 30%), 0 4px 16px rgba(0, 0, 0, 20%);
--app-pull-indicator-surface-opacity: var(--transparent-opacity-heavy, 0.5); --app-pull-indicator-surface-opacity: var(--transparent-opacity-heavy, 0.5);
} }