Files
fitness-coach/miniprogram/components/navbar/index.wxss
wm 2117225cbb fix: 分类页顶部穿透 + 筛选条收起为「几个选中 + 全部类型」
- navbar 背景由半透明渐变(rgba 0.55~0.92)改为实色不透明渐变(#0B0F0E→#0E1412),杜绝 sticky 滚动时内容透视
- filter-bar 内联取消横滑铺全部:收起态只展示最多 3 个选中 chip + 末尾『全部类型』按钮,点击才展开面板陈列全部(选中置顶)
- 单选点已选 chip 打开面板切换;多选点已选 chip 直接移除;超出 3 个显示 +N
2026-07-26 13:10:42 +08:00

61 lines
1.3 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

.navbar {
background: linear-gradient(180deg, #0B0F0E 0%, #0E1412 100%);
position: sticky;
top: 0;
z-index: 50;
}
.navbar__status { width: 100%; }
.navbar__bar {
height: 88rpx;
display: flex;
align-items: center;
position: relative;
padding: 0 24rpx;
}
/* 返回键:整块左侧区域可点,热区远大于图标本身 */
.navbar__back {
position: relative;
width: 72rpx;
height: 88rpx;
display: flex;
align-items: center;
justify-content: flex-start;
margin-left: -10rpx; /* 让箭头更贴近系统返回键位置 */
z-index: 2;
}
/* 扩展可点热区,提升命中率(左右留白也算可点) */
.navbar__back::after {
content: '';
position: absolute;
left: 0;
right: -24rpx;
top: 0;
bottom: 0;
}
.navbar__back--hover { opacity: 0.5; }
/* 用 CSS 绘制清晰、较粗的左箭头,避免依赖字体渲染 字符 */
.navbar__arrow {
width: 20rpx;
height: 20rpx;
border-left: 5rpx solid var(--gold);
border-bottom: 5rpx solid var(--gold);
transform: rotate(45deg);
margin-left: 14rpx;
box-sizing: border-box;
}
.navbar__title {
position: absolute;
left: 0;
right: 0;
text-align: center;
font-size: 34rpx;
font-weight: 700;
letter-spacing: 2rpx;
color: var(--text);
z-index: 1;
pointer-events: none; /* 不拦截返回键的点击 */
}