119 lines
3.2 KiB
Plaintext
119 lines
3.2 KiB
Plaintext
/* ═════ 全局样式 —— 对齐 H5 h5/css/style.css 的 1'me 设计变量 ═════
|
||
单位换算：H5 的 calc(N * var(--u))（375 设计宽基准）→ 2N rpx（750rpx = 屏宽）。
|
||
H5 里固定 px 的字号保持 px 不变。
|
||
注意：淘宝小程序 acss 不支持 @font-face，字体退化为系统字体栈。 */
|
||
page {
|
||
background: #EFEFEF;
|
||
color: #282828;
|
||
font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
|
||
font-size: 14px;
|
||
-webkit-font-smoothing: antialiased;
|
||
}
|
||
|
||
/* Center against the full screen, independently of native left/right buttons. */
|
||
.brand-header { position:fixed; left:0; top:0; width:100%; box-sizing:border-box; background:#FFFFFF; color:#282828; z-index:70; pointer-events:none; }
|
||
.brand-header-line { position:relative; width:100%; display:flex; align-items:center; justify-content:center; }
|
||
.brand-header-title { display:block; width:calc(100% - 152px); text-align:center; font-size:15px; font-weight:500; line-height:22px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
|
||
|
||
/* ─── 主按钮：长方形 + 小倒角（H5 设计稿 181×37，圆角 5） ─── */
|
||
.btn-primary {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 362rpx;
|
||
height: 74rpx;
|
||
background: #F5F078;
|
||
border-radius: 10rpx;
|
||
color: #282828;
|
||
font-size: 14.5px;
|
||
font-weight: 500;
|
||
letter-spacing: 1rpx;
|
||
border: none;
|
||
padding: 0;
|
||
line-height: 1;
|
||
}
|
||
.btn-primary::after { border: none; }
|
||
.btn-primary.btn-disabled { opacity: .5; }
|
||
|
||
/* ─── 折线箭头（H5 .chev） ─── */
|
||
.chev {
|
||
width: 9px;
|
||
height: 9px;
|
||
border: solid #2C2C2C;
|
||
border-width: 0 2px 2px 0;
|
||
display: inline-block;
|
||
padding: 2px;
|
||
box-sizing: border-box;
|
||
}
|
||
.chev.left { transform: rotate(135deg); }
|
||
.chev.right { transform: rotate(-45deg); }
|
||
.chev.down { transform: rotate(45deg); }
|
||
|
||
/* ─── 圆形返回按钮（H5 .nav-back） ─── */
|
||
.nav-back {
|
||
width: 27px;
|
||
height: 27px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border: 1px solid #E5E5E5;
|
||
border-radius: 50%;
|
||
background: #fff;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
/* ─── 弹窗（H5 隐私协议/政策层） ─── */
|
||
.overlay {
|
||
position: fixed;
|
||
left: 0; top: 0; right: 0; bottom: 0;
|
||
background: rgba(0, 0, 0, .6);
|
||
z-index: 100;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
.popup {
|
||
position: relative;
|
||
width: 640rpx;
|
||
max-height: 78vh;
|
||
background: #FFFFFF;
|
||
border-radius: 14rpx;
|
||
padding: 44rpx 40rpx 36rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
.popup-scroll { max-height: 52vh; }
|
||
.popup-title {
|
||
font-size: 19px;
|
||
font-weight: 700;
|
||
text-align: center;
|
||
line-height: 1.4;
|
||
color: #282828;
|
||
margin-bottom: 24rpx;
|
||
}
|
||
.popup-body {
|
||
font-size: 13px;
|
||
color: #4A4A4A;
|
||
line-height: 1.75;
|
||
}
|
||
.popup-close {
|
||
position: absolute;
|
||
top: 16rpx;
|
||
right: 16rpx;
|
||
width: 56rpx;
|
||
height: 56rpx;
|
||
line-height: 56rpx;
|
||
text-align: center;
|
||
font-size: 18px;
|
||
color: #868686;
|
||
background: none;
|
||
padding: 0;
|
||
}
|
||
.popup-close::after { border: none; }
|
||
|
||
/* ─── 卡片（H5 .card） ─── */
|
||
.card {
|
||
background: #FFFFFF;
|
||
border-radius: 14rpx;
|
||
box-sizing: border-box;
|
||
}
|