fix: 默认导航栏顶部超宽空白——微信Android WebView在viewport-fit=cover下误报safe-area-inset-top,将uni内置H5导航栏(calc(44px+env))垫高;App.vue全局强制回固定44px(影响参加/使用指南、协议、权益详情等默认导航栏页面)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Fable 5
parent
be4aafa6fd
commit
b9895049d1
@@ -23,4 +23,23 @@
|
|||||||
Arial, Helvetica, sans-serif;
|
Arial, Helvetica, sans-serif;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* xuchao: 修复默认导航栏在微信 WebView 内顶部超宽空白(参加/使用指南、协议等页)——
|
||||||
|
uni-app 内置 H5 导航栏高度为 calc(44px + env(safe-area-inset-top)),页面模板带
|
||||||
|
viewport-fit=cover 时,部分 Android 微信 WebView 会误报状态栏高度(而 H5 视口本
|
||||||
|
就位于微信原生标题栏下方、并未被遮挡),导致导航栏被垫高。强制回退固定 44px。
|
||||||
|
标准浏览器/ iOS 中该 env 值为 0,此覆盖无副作用 */
|
||||||
|
uni-page-head .uni-page-head {
|
||||||
|
height: 44px !important;
|
||||||
|
padding-top: 7px !important;
|
||||||
|
}
|
||||||
|
uni-page-head .uni-page-head ~ .uni-placeholder {
|
||||||
|
height: 44px !important;
|
||||||
|
}
|
||||||
|
uni-page-head[uni-page-head-type='default'] ~ uni-page-wrapper {
|
||||||
|
height: calc(100% - 44px) !important;
|
||||||
|
}
|
||||||
|
.uni-app--showtabbar uni-page-head[uni-page-head-type='default'] ~ uni-page-wrapper {
|
||||||
|
height: calc(100% - 44px) !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user