diff --git a/apps/h5-partner/src/styles.css b/apps/h5-partner/src/styles.css index d3a4a78..c24aff5 100644 --- a/apps/h5-partner/src/styles.css +++ b/apps/h5-partner/src/styles.css @@ -1802,7 +1802,7 @@ nav.app-tabbar .app-tabbar-label { .partner-sticky-filter { position: sticky; - top: 56px; + top: 0; z-index: 40; background: rgba(250, 249, 247, 0.95); backdrop-filter: blur(8px); @@ -3067,10 +3067,21 @@ body { border-top: 1px dashed rgba(166, 29, 36, 0.15); } -/* 微信 H5 系统标题已展示:隐藏页内重复标题,保留返回键与顶栏布局 */ +/* 微信 H5 系统标题已展示:隐藏页内重复标题,保留返回键与操作区 */ .app-page-title { - visibility: hidden; - font-size: 0 !important; - line-height: 0 !important; - color: transparent !important; + display: none !important; +} + +/* 仅含标题的顶栏一并收起,去掉空白条;有返回/操作的顶栏保留 */ +header:has(> .app-page-title:only-child), +.header.app-page-header:has(> .app-page-title:only-child), +.app-page-header:has(> .app-page-title:only-child) { + display: none !important; + height: 0 !important; + min-height: 0 !important; + padding: 0 !important; + margin: 0 !important; + overflow: hidden; + border: none !important; + box-shadow: none !important; } diff --git a/apps/h5-shop/src/styles.css b/apps/h5-shop/src/styles.css index de00600..d5e9cb4 100644 --- a/apps/h5-shop/src/styles.css +++ b/apps/h5-shop/src/styles.css @@ -1489,25 +1489,13 @@ } .shop-records-header { - position: fixed; - top: 0; - left: 50%; - transform: translateX(-50%); - width: 100%; - max-width: 480px; - height: 56px; - display: flex; - align-items: center; - justify-content: center; - padding: 0 var(--space-page); - background: rgba(250, 249, 247, 0.9); - backdrop-filter: blur(10px); - z-index: 50; + /* 页内标题已隐藏:不再占位;保留类名以免改 JSX */ + display: none !important; } .shop-records-filters { position: sticky; - top: 56px; + top: 0; z-index: 40; background: var(--color-surface); border-bottom: 1px solid var(--color-surface-container-highest); @@ -1578,7 +1566,7 @@ } .shop-records-main { - padding-top: 56px; + padding-top: 0; } .shop-records-summary { @@ -2732,11 +2720,24 @@ cursor: pointer; } -/* 微信 H5 系统标题已展示:隐藏页内重复标题,保留返回键与顶栏布局 */ +/* 微信 H5 系统标题已展示:隐藏页内重复标题,保留返回键与操作区 */ .app-page-title { - visibility: hidden; - font-size: 0 !important; - line-height: 0 !important; - color: transparent !important; + display: none !important; +} + +/* 仅含标题的顶栏一并收起,去掉空白条;有返回/操作的顶栏保留 */ +header:has(> .app-page-title:only-child), +.shop-home-header:has(> .app-page-title:only-child), +.shop-mine-header:has(> .app-page-title:only-child), +.shop-records-header:has(> .app-page-title:only-child), +.app-page-header:has(> .app-page-title:only-child) { + display: none !important; + height: 0 !important; + min-height: 0 !important; + padding: 0 !important; + margin: 0 !important; + overflow: hidden; + border: none !important; + box-shadow: none !important; } diff --git a/apps/h5-user/src/components/SubPageHeader.tsx b/apps/h5-user/src/components/SubPageHeader.tsx index 2044b4a..ddad7b0 100644 --- a/apps/h5-user/src/components/SubPageHeader.tsx +++ b/apps/h5-user/src/components/SubPageHeader.tsx @@ -5,11 +5,10 @@ type SubPageHeaderProps = { export default function SubPageHeader({ title, onBack }: SubPageHeaderProps) { return ( -
+
-

{title}

); } diff --git a/apps/h5-user/src/components/TabMainHeader.tsx b/apps/h5-user/src/components/TabMainHeader.tsx index ee59a24..5120a7e 100644 --- a/apps/h5-user/src/components/TabMainHeader.tsx +++ b/apps/h5-user/src/components/TabMainHeader.tsx @@ -7,9 +7,13 @@ type TabMainHeaderProps = { }; export default function TabMainHeader({ title, extra, className = '' }: TabMainHeaderProps) { + // H5:系统标题已展示;无右侧内容时整栏不渲染,避免顶部留白 + if (!extra) { + return null; + } + return ( -
-

{title}

+
{extra ?
{extra}
: null}
); diff --git a/apps/h5-user/src/styles.css b/apps/h5-user/src/styles.css index 499042f..26ea5e2 100644 --- a/apps/h5-user/src/styles.css +++ b/apps/h5-user/src/styles.css @@ -917,6 +917,11 @@ z-index: 40; } +/* 首页有城市栏顶栏时 top=56;无额外内容已不渲染顶栏时贴顶 */ +.home-page:not(:has(.tab-main-header)) .home-aroma-nav { + top: 0; +} + .home-aroma-tab { border: none; background: none; @@ -5926,3 +5931,20 @@ opacity: 0.5; } +/* 微信 H5 系统标题已展示:隐藏页内重复标题;仅标题顶栏收起 */ +.app-page-title { + display: none !important; +} + +header:has(> .app-page-title:only-child), +.app-page-header:has(> .app-page-title:only-child) { + display: none !important; + height: 0 !important; + min-height: 0 !important; + padding: 0 !important; + margin: 0 !important; + overflow: hidden; + border: none !important; + box-shadow: none !important; +} + diff --git a/apps/mini-user/src/components/TabMainHeader.tsx b/apps/mini-user/src/components/TabMainHeader.tsx index b561dfb..c3e7d18 100644 --- a/apps/mini-user/src/components/TabMainHeader.tsx +++ b/apps/mini-user/src/components/TabMainHeader.tsx @@ -13,6 +13,11 @@ const isH5 = process.env.TARO_ENV === 'h5'; export default function TabMainHeader({ title, extra }: TabMainHeaderProps) { const metrics = useNavBarMetrics(); + // H5:系统标题已展示;无右侧内容时整栏不渲染,避免顶部留白 + if (isH5 && !extra) { + return null; + } + return ( {!isH5 ? {title} : null} diff --git a/apps/mini-user/src/pages/home/index.tsx b/apps/mini-user/src/pages/home/index.tsx index bb33741..4ed7c74 100644 --- a/apps/mini-user/src/pages/home/index.tsx +++ b/apps/mini-user/src/pages/home/index.tsx @@ -65,7 +65,10 @@ export default function HomePage() { const onSale = tab === 'QINGXIANG'; return ( - + diff --git a/apps/mini-user/src/pages/mine/index.tsx b/apps/mini-user/src/pages/mine/index.tsx index 66b22ca..3325e08 100644 --- a/apps/mini-user/src/pages/mine/index.tsx +++ b/apps/mini-user/src/pages/mine/index.tsx @@ -210,7 +210,10 @@ export default function MinePage() { if (!authed) { return ( - + @@ -247,7 +250,10 @@ export default function MinePage() { const memberLabel = hasWechat ? '好客会员' : canWxBind ? '微信未授权' : '未授权微信'; return ( - + diff --git a/apps/mini-user/src/pages/stores/index.tsx b/apps/mini-user/src/pages/stores/index.tsx index f76720e..d1db545 100644 --- a/apps/mini-user/src/pages/stores/index.tsx +++ b/apps/mini-user/src/pages/stores/index.tsx @@ -73,7 +73,10 @@ export default function StoresPage() { } return ( - + setRegionOpen(true)}> diff --git a/apps/mini-user/src/styles/nav-bar.css b/apps/mini-user/src/styles/nav-bar.css index 00f3b96..047b6e6 100644 --- a/apps/mini-user/src/styles/nav-bar.css +++ b/apps/mini-user/src/styles/nav-bar.css @@ -20,14 +20,13 @@ padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px)); } -/* ── Tab 主页面顶栏(实底 sticky) ── */ -.tab-main-header { - position: sticky; +/* H5 无 Tab 顶栏:贴顶,去掉标题栏留白 */ +.page-shell.h5-no-tab-header { + --nav-bar-height: 0px; +} + +.page-shell.h5-no-tab-header .home-aroma-nav { top: 0; - z-index: 50; - background: var(--color-background); - box-shadow: var(--shadow-card); - box-sizing: border-box; } .tab-main-header__content { diff --git a/packages/shared-ui/src/base.css b/packages/shared-ui/src/base.css index 301b779..42b8342 100644 --- a/packages/shared-ui/src/base.css +++ b/packages/shared-ui/src/base.css @@ -534,7 +534,8 @@ button, input, select, textarea { font: inherit; } .page-header-title--spacer { font-size: 0; line-height: 0; - min-height: 26px; + min-height: 0; + flex: 1; } /* Coupon badge (ticket notch) */