调整商品详情页面的分享按钮位置
This commit is contained in:
@@ -19,3 +19,34 @@ body {
|
||||
font-family: var(--font-body);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* 全局隐藏滚动条(H5 + 小程序均可滚动,仅隐藏轨道) */
|
||||
html,
|
||||
page,
|
||||
body,
|
||||
#app,
|
||||
.taro_page,
|
||||
.taro_router,
|
||||
.taro-tabbar__panel {
|
||||
scrollbar-width: none; /* Firefox */
|
||||
-ms-overflow-style: none; /* legacy Edge */
|
||||
}
|
||||
|
||||
html::-webkit-scrollbar,
|
||||
page::-webkit-scrollbar,
|
||||
body::-webkit-scrollbar,
|
||||
#app::-webkit-scrollbar,
|
||||
.taro_page::-webkit-scrollbar,
|
||||
.taro_router::-webkit-scrollbar,
|
||||
.taro-tabbar__panel::-webkit-scrollbar,
|
||||
*::-webkit-scrollbar {
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
display: none !important;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
* {
|
||||
scrollbar-width: none;
|
||||
-ms-overflow-style: none;
|
||||
}
|
||||
|
||||
@@ -41,7 +41,9 @@ export default function PageNavBar({
|
||||
) : (
|
||||
<View className="page-nav-bar__btn page-nav-bar__btn--back page-nav-bar__btn--placeholder" />
|
||||
)}
|
||||
{right ?? (
|
||||
{right ? (
|
||||
<View className="page-nav-bar__right-slot">{right}</View>
|
||||
) : (
|
||||
<View className="page-nav-bar__btn page-nav-bar__btn--right page-nav-bar__btn--placeholder" />
|
||||
)}
|
||||
</View>
|
||||
|
||||
@@ -167,7 +167,7 @@ export default function RegionPicker({
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
<ScrollView className="region-picker-list" scrollY>
|
||||
<ScrollView className="region-picker-list" scrollY showScrollbar={false}>
|
||||
{listItems.map((item) => (
|
||||
<View
|
||||
key={item}
|
||||
|
||||
@@ -18,7 +18,8 @@ const H5_FALLBACK: NavBarMetrics = {
|
||||
statusBarHeight: 0,
|
||||
navBarHeight: 56,
|
||||
navContentHeight: 56,
|
||||
navBarPaddingRight: 16,
|
||||
/** 避开微信内置浏览器右上角 ··· / 设置入口(约一颗胶囊宽) */
|
||||
navBarPaddingRight: 96,
|
||||
navBarPaddingLeft: 16,
|
||||
};
|
||||
|
||||
@@ -33,7 +34,13 @@ const WEAPP_FALLBACK: NavBarMetrics = {
|
||||
/** 计算小程序自定义导航栏尺寸(对齐微信胶囊按钮) */
|
||||
export function getNavBarMetrics(): NavBarMetrics {
|
||||
if (process.env.TARO_ENV === 'h5') {
|
||||
return H5_FALLBACK;
|
||||
// H5:在微信浏览器内额外避让右上角菜单;非微信保持较小右侧留白
|
||||
const inWechat =
|
||||
typeof navigator !== 'undefined' && /MicroMessenger/i.test(navigator.userAgent || '');
|
||||
return {
|
||||
...H5_FALLBACK,
|
||||
navBarPaddingRight: inWechat ? 96 : 16,
|
||||
};
|
||||
}
|
||||
|
||||
try {
|
||||
|
||||
@@ -127,6 +127,26 @@
|
||||
right: 0;
|
||||
}
|
||||
|
||||
/* 右侧操作槽:固定贴着内容区右缘(内容区已用 navBarPaddingRight 避让微信菜单) */
|
||||
.page-nav-bar__right-slot {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0;
|
||||
transform: translateY(-50%);
|
||||
z-index: 2;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.page-nav-bar__right-slot .page-nav-bar__btn {
|
||||
position: relative;
|
||||
top: auto;
|
||||
left: auto;
|
||||
right: auto;
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.page-nav-bar--solid .page-nav-bar__btn {
|
||||
background: transparent;
|
||||
}
|
||||
@@ -157,7 +177,7 @@
|
||||
height: var(--nav-content-height);
|
||||
line-height: var(--nav-content-height);
|
||||
text-align: center;
|
||||
padding: 0 48px;
|
||||
padding: 0 88px 0 56px;
|
||||
box-sizing: border-box;
|
||||
opacity: 0;
|
||||
font-family: var(--font-headline);
|
||||
|
||||
Reference in New Issue
Block a user