fix(ui): 移除快速切换时闪烁的整页淡入动画
- 保留首帧前切好主题背景 - 去掉页面根容器从透明度 0 重新淡入的动画,避免快速点 tab 时闪系统底色
This commit is contained in:
Vendored
+1
-1
File diff suppressed because one or more lines are too long
@@ -10,19 +10,12 @@
|
|||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
background-color: var(--bg-page, #ffffff);
|
background-color: var(--bg-page, #ffffff);
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
animation: page-fade-in 0.24s ease both;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.theme-dark {
|
.theme-dark {
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
background-color: var(--bg-page, #191919);
|
background-color: var(--bg-page, #191919);
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
animation: page-fade-in 0.24s ease both;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes page-fade-in {
|
|
||||||
from { opacity: 0; }
|
|
||||||
to { opacity: 1; }
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 变量定义 */
|
/* 变量定义 */
|
||||||
|
|||||||
@@ -36,10 +36,9 @@ test('scroll top back button matches the global liquid-glass back style', () =>
|
|||||||
assert.match(css, /backdrop-filter: blur\(24px\) saturate\(1\.7\) brightness\(1\.05\)/)
|
assert.match(css, /backdrop-filter: blur\(24px\) saturate\(1\.7\) brightness\(1\.05\)/)
|
||||||
})
|
})
|
||||||
|
|
||||||
test('app sets page background before first render and fades pages in', () => {
|
test('app sets page background before first render without a blinking full fade', () => {
|
||||||
const appSource = read('src/app.tsx')
|
const appSource = read('src/app.tsx')
|
||||||
const appCss = read('src/app.scss')
|
const appCss = read('src/app.scss')
|
||||||
assert.match(appSource, /componentWillMount/)
|
assert.match(appSource, /componentWillMount/)
|
||||||
assert.match(appCss, /@keyframes page-fade-in/)
|
assert.doesNotMatch(appCss, /animation:\s*page-fade-in/)
|
||||||
assert.match(appCss, /animation: page-fade-in/)
|
|
||||||
})
|
})
|
||||||
|
|||||||
Reference in New Issue
Block a user