真机修复:lightbox 打开时隐藏吸顶顶栏——backdrop-filter 元素的合成层在真机上会盖住 z-index 更高的遮罩(顶部出现未遮罩亮带);顺带全屏观感更干净
This commit is contained in:
@@ -20,15 +20,20 @@ watch(
|
||||
window.addEventListener('keydown', onKey)
|
||||
prevOverflow = document.body.style.overflow
|
||||
document.body.style.overflow = 'hidden'
|
||||
// 吸顶栏带 backdrop-filter,真机上其合成层会盖在遮罩之上
|
||||
// (遮罩明明 z-index 更高也拦不住)——索性开预览时整个藏掉
|
||||
document.body.classList.add('lb-open')
|
||||
} else {
|
||||
window.removeEventListener('keydown', onKey)
|
||||
document.body.style.overflow = prevOverflow
|
||||
document.body.classList.remove('lb-open')
|
||||
}
|
||||
}
|
||||
)
|
||||
onBeforeUnmount(() => {
|
||||
window.removeEventListener('keydown', onKey)
|
||||
document.body.style.overflow = prevOverflow
|
||||
document.body.classList.remove('lb-open')
|
||||
})
|
||||
|
||||
// 手机滑动翻页:横向位移超 44px 且大于纵向位移才算一次滑动
|
||||
|
||||
@@ -1452,6 +1452,12 @@ a.cm-name-a:hover {color: var(--accent);}
|
||||
.admin-shell .image-resize-handle {opacity: 0.45;}
|
||||
.admin-shell .image-wrapper:hover .image-resize-handle {opacity: 1;}
|
||||
|
||||
/* lightbox 打开时藏掉吸顶/固定栏:一是全屏观感,二是绕开真机上
|
||||
backdrop-filter 元素合成层盖过遮罩的 Chromium 绘制问题 */
|
||||
body.lb-open .sticky-head,
|
||||
body.lb-open .topbar,
|
||||
body.lb-open .reading-bar {visibility: hidden;}
|
||||
|
||||
/* classic 文章页阅读进度条:视口顶部细线,vivid 的同款能力 */
|
||||
.reading-bar {position: fixed;
|
||||
top: 0;
|
||||
|
||||
Reference in New Issue
Block a user