小程序端:设计系统收敛与排版层级修复
问题:88 个 wxss 里散落大量硬编码颜色/字号/字重,无法统一调整; 部分正文对比度不达 WCAG AA(4.5:1);组件触摸目标偏小。 改动: - 硬编码颜色收敛到语义 token(颜色统一走 design token,不再散落字面值) - 修正全站字号阶梯:正文 ≥12px、角标 ≥11px;字重只用 400/500/600/700 - 组件触摸目标提升到 ≥44px,并补交互反馈 - 首页补氛围层次、强化排版层级 验证(本轮实测): - UI 契约门禁 18/18 PASS(含 wxml 结构、wxss 组件选择器、token 显式值断言) - 声明级体检 88/88 通过(全部 wxss 声明合法) 交付物:artifacts/miniapp-design-v2-preview.html
This commit is contained in:
@@ -1,112 +1,112 @@
|
||||
/* 关于我们样式 */
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #f5f5f5;
|
||||
padding-bottom: 48rpx;
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-subtle);
|
||||
padding-bottom:48rpx;
|
||||
}
|
||||
|
||||
.logo-section {
|
||||
background: linear-gradient(135deg, #E96B6B 0%, #ff9a9a 100%);
|
||||
padding: 80rpx 48rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background:linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
|
||||
padding:80rpx 48rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
}
|
||||
|
||||
.logo-icon {
|
||||
font-size: 100rpx;
|
||||
margin-bottom: 24rpx;
|
||||
font-size:100rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.platform-name {
|
||||
font-size: 36rpx;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
margin-bottom: 8rpx;
|
||||
font-size:36rpx;
|
||||
font-weight:700;
|
||||
color:var(--color-text-inverse);
|
||||
margin-bottom:8rpx;
|
||||
}
|
||||
|
||||
.slogan {
|
||||
font-size: 26rpx;
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
margin-bottom: 32rpx;
|
||||
font-size:26rpx;
|
||||
color:rgba(255, 255, 255, 0.85);
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.version {
|
||||
font-size: 22rpx;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
font-size:24rpx;
|
||||
color:rgba(255, 255, 255, 0.7);
|
||||
}
|
||||
|
||||
.section {
|
||||
margin-top: 24rpx;
|
||||
background: #fff;
|
||||
margin-top:24rpx;
|
||||
background:var(--color-bg-card);
|
||||
}
|
||||
|
||||
.section-title {
|
||||
padding: 24rpx 32rpx 16rpx;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
padding:24rpx 32rpx 16rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.intro-text {
|
||||
padding: 0 32rpx 20rpx;
|
||||
font-size: 28rpx;
|
||||
color: #555;
|
||||
line-height: 1.8;
|
||||
padding:0 32rpx 20rpx;
|
||||
font-size:28rpx;
|
||||
color:var(--color-text-primary);
|
||||
line-height:1.8;
|
||||
}
|
||||
|
||||
.list-group {
|
||||
padding: 0 32rpx;
|
||||
padding:0 32rpx;
|
||||
}
|
||||
|
||||
.list-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 28rpx 0;
|
||||
border-bottom: 1rpx solid #f5f5f5;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
padding:28rpx 0;
|
||||
border-bottom:1rpx solid var(--color-divider);
|
||||
}
|
||||
|
||||
.list-row:last-child {
|
||||
border-bottom: none;
|
||||
border-bottom:none;
|
||||
}
|
||||
|
||||
.list-icon {
|
||||
font-size: 36rpx;
|
||||
margin-right: 24rpx;
|
||||
width: 48rpx;
|
||||
text-align: center;
|
||||
font-size:36rpx;
|
||||
margin-right:24rpx;
|
||||
width:48rpx;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.list-info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
flex:1;
|
||||
min-width:0;
|
||||
}
|
||||
|
||||
.list-label {
|
||||
display: block;
|
||||
font-size: 32rpx;
|
||||
color: #2d2d2d;
|
||||
line-height: 1.4;
|
||||
display:block;
|
||||
font-size:32rpx;
|
||||
color:var(--color-text-strong);
|
||||
line-height:1.4;
|
||||
}
|
||||
|
||||
.list-desc {
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
line-height: 1.4;
|
||||
margin-top: 4rpx;
|
||||
display:block;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
line-height:1.4;
|
||||
margin-top:4rpx;
|
||||
}
|
||||
|
||||
.list-arrow {
|
||||
font-size: 32rpx;
|
||||
color: #ccc;
|
||||
margin-left: 16rpx;
|
||||
font-size:32rpx;
|
||||
color:var(--color-text-disabled);
|
||||
margin-left:16rpx;
|
||||
}
|
||||
|
||||
.footer {
|
||||
margin-top: 48rpx;
|
||||
text-align: center;
|
||||
font-size: 22rpx;
|
||||
color: #ccc;
|
||||
padding: 0 32rpx;
|
||||
line-height: 1.8;
|
||||
margin-top:48rpx;
|
||||
text-align:center;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-disabled);
|
||||
padding:0 32rpx;
|
||||
line-height:1.8;
|
||||
}
|
||||
|
||||
@@ -1,141 +1,141 @@
|
||||
.page {
|
||||
padding: 32rpx;
|
||||
background: #FFF8F7;
|
||||
min-height: 100vh;
|
||||
padding:32rpx;
|
||||
background:var(--color-primary-lighter);
|
||||
min-height:100vh;
|
||||
}
|
||||
|
||||
.warning-banner {
|
||||
background: #FFF3F2;
|
||||
border-radius: 20rpx;
|
||||
padding: 32rpx;
|
||||
text-align: center;
|
||||
margin-bottom: 32rpx;
|
||||
background:var(--color-primary-light);
|
||||
border-radius:20rpx;
|
||||
padding:32rpx;
|
||||
text-align:center;
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.warning-icon { font-size: 56rpx; display: block; }
|
||||
.warning-title { font-size: 32rpx; font-weight: bold; color: #E96B6B; display: block; margin-top: 12rpx; }
|
||||
.warning-icon { font-size:56rpx; display:block; }
|
||||
.warning-title { font-size:32rpx; font-weight:bold; color:var(--color-primary-strong); display:block; margin-top:12rpx; }
|
||||
|
||||
.info-section {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 28rpx;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
padding:28rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
display: block;
|
||||
margin-bottom: 20rpx;
|
||||
font-size:28rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
display:block;
|
||||
margin-bottom:20rpx;
|
||||
}
|
||||
|
||||
.info-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:12rpx;
|
||||
}
|
||||
|
||||
.info-item {
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
line-height: 1.6;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-secondary);
|
||||
line-height:1.6;
|
||||
}
|
||||
|
||||
.blocker-section {
|
||||
background: #FFF8E1;
|
||||
border-radius: 20rpx;
|
||||
padding: 28rpx;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-warning-light);
|
||||
border-radius:20rpx;
|
||||
padding:28rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.blocker-title {
|
||||
font-size: 26rpx;
|
||||
font-weight: bold;
|
||||
color: #E59A32;
|
||||
display: block;
|
||||
margin-bottom: 12rpx;
|
||||
font-size:26rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-warning-strong);
|
||||
display:block;
|
||||
margin-bottom:12rpx;
|
||||
}
|
||||
|
||||
.blocker-item {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
display: block;
|
||||
margin-bottom: 8rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
display:block;
|
||||
margin-bottom:8rpx;
|
||||
}
|
||||
|
||||
.reason-options {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 16rpx;
|
||||
margin-bottom: 16rpx;
|
||||
display:flex;
|
||||
flex-wrap:wrap;
|
||||
gap:16rpx;
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.reason-chip {
|
||||
padding: 12rpx 24rpx;
|
||||
background: #F5F5F5;
|
||||
border-radius: 32rpx;
|
||||
font-size: 24rpx;
|
||||
color: #666;
|
||||
border: 2rpx solid transparent;
|
||||
padding:12rpx 24rpx;
|
||||
background:var(--color-bg-subtle);
|
||||
border-radius:32rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-secondary);
|
||||
border:2rpx solid transparent;
|
||||
}
|
||||
|
||||
.reason-chip.active {
|
||||
background: #FFF3F2;
|
||||
border-color: #E96B6B;
|
||||
color: #E96B6B;
|
||||
background:var(--color-primary-light);
|
||||
border-color:var(--color-primary);
|
||||
color:var(--color-primary-strong);
|
||||
}
|
||||
|
||||
.other-reason {
|
||||
width: 100%;
|
||||
min-height: 120rpx;
|
||||
font-size: 26rpx;
|
||||
background: #F9F9F9;
|
||||
border-radius: 16rpx;
|
||||
padding: 20rpx;
|
||||
box-sizing: border-box;
|
||||
width:100%;
|
||||
min-height:120rpx;
|
||||
font-size:26rpx;
|
||||
background:var(--color-bg-subtle);
|
||||
border-radius:16rpx;
|
||||
padding:20rpx;
|
||||
box-sizing:border-box;
|
||||
}
|
||||
|
||||
.btn-confirm {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
border-radius: 44rpx;
|
||||
font-size: 30rpx;
|
||||
margin-top: 32rpx;
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
border-radius:44rpx;
|
||||
font-size:30rpx;
|
||||
margin-top:32rpx;
|
||||
}
|
||||
|
||||
.btn-confirm[disabled] { background: #CCC; }
|
||||
.btn-confirm[disabled] { background:var(--color-bg-muted); }
|
||||
|
||||
.hint {
|
||||
display: block;
|
||||
text-align: center;
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
margin-top: 16rpx;
|
||||
line-height: 1.5;
|
||||
display:block;
|
||||
text-align:center;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
margin-top:16rpx;
|
||||
line-height:1.5;
|
||||
}
|
||||
|
||||
/* 成功状态 */
|
||||
.submitted {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 120rpx 32rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
padding:120rpx 32rpx;
|
||||
}
|
||||
|
||||
.success-icon { font-size: 80rpx; color: #E96B6B; margin-bottom: 24rpx; }
|
||||
.success-title { font-size: 36rpx; font-weight: bold; color: #1A1A1A; margin-bottom: 16rpx; }
|
||||
.success-hint { font-size: 28rpx; color: #666; text-align: center; line-height: 1.6; margin-bottom: 48rpx; }
|
||||
.success-icon { font-size:80rpx; color:var(--color-primary-strong); margin-bottom:24rpx; }
|
||||
.success-title { font-size:36rpx; font-weight:bold; color:var(--color-text-strong); margin-bottom:16rpx; }
|
||||
.success-hint { font-size:28rpx; color:var(--color-text-secondary); text-align:center; line-height:1.6; margin-bottom:48rpx; }
|
||||
.btn-back {
|
||||
width: 60%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
border-radius: 44rpx;
|
||||
font-size: 30rpx;
|
||||
width:60%;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
border-radius:44rpx;
|
||||
font-size:30rpx;
|
||||
}
|
||||
|
||||
@@ -1,59 +1,59 @@
|
||||
.page { padding: 32rpx; background: #FFF8F7; min-height: 100vh; }
|
||||
.page { padding:32rpx; background:var(--color-primary-lighter); min-height:100vh; }
|
||||
|
||||
.status-card {
|
||||
background: #fff;
|
||||
border-radius: 24rpx;
|
||||
padding: 48rpx 32rpx;
|
||||
text-align: center;
|
||||
margin-bottom: 32rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.04);
|
||||
background:var(--color-bg-card);
|
||||
border-radius:24rpx;
|
||||
padding:48rpx 32rpx;
|
||||
text-align:center;
|
||||
margin-bottom:32rpx;
|
||||
box-shadow:0 2rpx 12rpx rgba(0,0,0,0.04);
|
||||
}
|
||||
|
||||
.status-card.paused {
|
||||
background: #F9F9F9;
|
||||
background:var(--color-bg-subtle);
|
||||
}
|
||||
|
||||
.status-icon { font-size: 72rpx; display: block; margin-bottom: 16rpx; }
|
||||
.status-title { font-size: 32rpx; font-weight: bold; color: #1A1A1A; display: block; }
|
||||
.status-hint { font-size: 24rpx; color: #999; display: block; margin-top: 12rpx; line-height: 1.5; }
|
||||
.status-icon { font-size:72rpx; display:block; margin-bottom:16rpx; }
|
||||
.status-title { font-size:32rpx; font-weight:bold; color:var(--color-text-strong); display:block; }
|
||||
.status-hint { font-size:24rpx; color:var(--color-text-tertiary); display:block; margin-top:12rpx; line-height:1.5; }
|
||||
|
||||
.btn-withdraw, .btn-resume {
|
||||
width: 80%;
|
||||
height: 72rpx;
|
||||
line-height: 72rpx;
|
||||
border-radius: 36rpx;
|
||||
font-size: 28rpx;
|
||||
margin-top: 32rpx;
|
||||
border: none;
|
||||
}
|
||||
width:80%;
|
||||
min-height:var(--tap-min);
|
||||
line-height:var(--tap-min);
|
||||
border-radius:36rpx;
|
||||
font-size:28rpx;
|
||||
margin-top:32rpx;
|
||||
border:none;
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
.btn-withdraw {
|
||||
background: #FFF3F2;
|
||||
color: #E96B6B;
|
||||
background:var(--color-primary-light);
|
||||
color:var(--color-primary-strong);
|
||||
}
|
||||
|
||||
.btn-resume {
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
}
|
||||
|
||||
.menu-list {
|
||||
background: #fff;
|
||||
border-radius: 24rpx;
|
||||
overflow: hidden;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:24rpx;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 32rpx 28rpx;
|
||||
border-bottom: 1rpx solid #f5f5f5;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
padding:32rpx 28rpx;
|
||||
border-bottom:1rpx solid var(--color-divider);
|
||||
}
|
||||
|
||||
.menu-item:last-child { border-bottom: none; }
|
||||
.menu-item.danger .menu-text { color: #E96B6B; }
|
||||
.menu-item:last-child { border-bottom:none; }
|
||||
.menu-item.danger .menu-text { color:var(--color-primary-strong); }
|
||||
|
||||
.menu-icon { font-size: 36rpx; margin-right: 20rpx; }
|
||||
.menu-text { flex: 1; font-size: 28rpx; color: #1A1A1A; }
|
||||
.menu-hint { font-size: 22rpx; color: #999; margin-right: 12rpx; }
|
||||
.menu-arrow { font-size: 32rpx; color: #CCC; }
|
||||
.menu-icon { font-size:36rpx; margin-right:20rpx; }
|
||||
.menu-text { flex:1; font-size:28rpx; color:var(--color-text-strong); }
|
||||
.menu-hint { font-size:24rpx; color:var(--color-text-tertiary); margin-right:12rpx; }
|
||||
.menu-arrow { font-size:32rpx; color:var(--color-text-disabled); }
|
||||
|
||||
@@ -1,156 +1,156 @@
|
||||
.page {
|
||||
padding: 32rpx;
|
||||
background: #FFF8F7;
|
||||
min-height: 100vh;
|
||||
padding:32rpx;
|
||||
background:var(--color-primary-lighter);
|
||||
min-height:100vh;
|
||||
}
|
||||
|
||||
.status-banner {
|
||||
background: linear-gradient(135deg, #E96B6B 0%, #C44545 100%);
|
||||
border-radius: 24rpx;
|
||||
padding: 48rpx 32rpx;
|
||||
text-align: center;
|
||||
margin-bottom: 32rpx;
|
||||
background:linear-gradient(135deg, var(--color-primary) 0%, var(--color-danger) 100%);
|
||||
border-radius:24rpx;
|
||||
padding:48rpx 32rpx;
|
||||
text-align:center;
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.banner-icon {
|
||||
font-size: 72rpx;
|
||||
display: block;
|
||||
margin-bottom: 16rpx;
|
||||
font-size:72rpx;
|
||||
display:block;
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.banner-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
display: block;
|
||||
font-size:36rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-inverse);
|
||||
display:block;
|
||||
}
|
||||
|
||||
.banner-status {
|
||||
font-size: 26rpx;
|
||||
color: rgba(255,255,255,0.85);
|
||||
display: block;
|
||||
margin-top: 12rpx;
|
||||
font-size:26rpx;
|
||||
color:rgba(255,255,255,0.85);
|
||||
display:block;
|
||||
margin-top:12rpx;
|
||||
}
|
||||
|
||||
.normal-state {
|
||||
text-align: center;
|
||||
padding: 80rpx 32rpx;
|
||||
text-align:center;
|
||||
padding:80rpx 32rpx;
|
||||
}
|
||||
|
||||
.normal-icon {
|
||||
font-size: 80rpx;
|
||||
color: #67C23A;
|
||||
display: block;
|
||||
margin-bottom: 24rpx;
|
||||
font-size:80rpx;
|
||||
color:var(--color-success-strong);
|
||||
display:block;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.normal-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
display: block;
|
||||
margin-bottom: 16rpx;
|
||||
font-size:32rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
display:block;
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.normal-hint {
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
display: block;
|
||||
line-height: 1.6;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-secondary);
|
||||
display:block;
|
||||
line-height:1.6;
|
||||
}
|
||||
|
||||
.actions-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:20rpx;
|
||||
}
|
||||
|
||||
.action-card {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 28rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.04);
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
padding:28rpx;
|
||||
box-shadow:0 2rpx 12rpx rgba(0,0,0,0.04);
|
||||
}
|
||||
|
||||
.action-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 16rpx;
|
||||
display:flex;
|
||||
justify-content:space-between;
|
||||
align-items:center;
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.action-type {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #E96B6B;
|
||||
font-size:28rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-primary-strong);
|
||||
}
|
||||
|
||||
.action-time {
|
||||
font-size: 22rpx;
|
||||
color: #BBB;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-disabled);
|
||||
}
|
||||
|
||||
.action-reason {
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
display: block;
|
||||
margin-bottom: 12rpx;
|
||||
line-height: 1.5;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-secondary);
|
||||
display:block;
|
||||
margin-bottom:12rpx;
|
||||
line-height:1.5;
|
||||
}
|
||||
|
||||
.action-expiry {
|
||||
font-size: 24rpx;
|
||||
color: #E59A32;
|
||||
display: block;
|
||||
margin-bottom: 20rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-warning-strong);
|
||||
display:block;
|
||||
margin-bottom:20rpx;
|
||||
}
|
||||
|
||||
.btn-appeal {
|
||||
width: 100%;
|
||||
height: 72rpx;
|
||||
line-height: 72rpx;
|
||||
background: #FFF3F2;
|
||||
color: #E96B6B;
|
||||
border-radius: 36rpx;
|
||||
font-size: 28rpx;
|
||||
border: 1rpx solid #E96B6B;
|
||||
}
|
||||
width:100%;
|
||||
min-height:var(--tap-min);
|
||||
line-height:var(--tap-min);
|
||||
background:var(--color-primary-light);
|
||||
color:var(--color-primary-strong);
|
||||
border-radius:36rpx;
|
||||
font-size:28rpx;
|
||||
border:1rpx solid var(--color-primary);
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
.appeal-hint {
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
text-align: center;
|
||||
margin-top: 16rpx;
|
||||
display:block;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
text-align:center;
|
||||
margin-top:16rpx;
|
||||
}
|
||||
|
||||
.appeal-disabled {
|
||||
text-align: center;
|
||||
padding: 60rpx 32rpx;
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
text-align:center;
|
||||
padding:60rpx 32rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
}
|
||||
|
||||
.disabled-hint {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
display: block;
|
||||
margin-bottom: 24rpx;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
display:block;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.btn-contact {
|
||||
width: 60%;
|
||||
height: 72rpx;
|
||||
line-height: 72rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
border-radius: 36rpx;
|
||||
font-size: 28rpx;
|
||||
border: none;
|
||||
}
|
||||
width:60%;
|
||||
min-height:var(--tap-min);
|
||||
line-height:var(--tap-min);
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
border-radius:36rpx;
|
||||
font-size:28rpx;
|
||||
border:none;
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
.loading-page {
|
||||
text-align: center;
|
||||
padding: 100rpx;
|
||||
color: #999;
|
||||
text-align:center;
|
||||
padding:100rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
@@ -1 +1 @@
|
||||
@import "../../styles/service-page.wxss";.activity-hero{height:360rpx;padding:48rpx 32rpx;box-sizing:border-box;background:linear-gradient(140deg,#F1D4C7,#F9ECE4);position:relative;overflow:hidden}.activity-hero:after{content:'相遇';position:absolute;right:28rpx;bottom:12rpx;font-size:90rpx;color:rgba(125,76,63,.15);font-weight:700}.activity-badge{display:inline-flex;padding:7rpx 14rpx;border-radius:999rpx;background:rgba(255,255,255,.75);color:#9A5B4E;font-size:21rpx}.activity-title{display:block;margin-top:28rpx;width:82%;font-size:40rpx;line-height:1.4;font-weight:700;color:#5E3730}.activity-slogan{display:block;margin-top:16rpx;font-size:23rpx;color:#8A5F57}.body-text{font-size:27rpx;color:var(--color-text-secondary);line-height:1.8}.rule-row{display:flex;gap:18rpx;align-items:flex-start;padding:16rpx 0;font-size:26rpx}.rule-row>text:first-child{width:42rpx;height:42rpx;display:flex;align-items:center;justify-content:center;flex:none;border-radius:50%;background:var(--color-primary-light);color:var(--color-primary);font-size:21rpx}.rule-row>text:last-child{padding-top:4rpx;line-height:1.55}
|
||||
@import "../../styles/service-page.wxss";.activity-hero{height:360rpx;padding:48rpx 32rpx;box-sizing:border-box;background:linear-gradient(140deg,var(--color-warning-light),var(--color-warning-light));position:relative;overflow:hidden}.activity-hero:after{content:'相遇';position:absolute;right:28rpx;bottom:12rpx;font-size:90rpx;color:rgba(125,76,63,.15);font-weight:700}.activity-badge{display:inline-flex;padding:7rpx 14rpx;border-radius:999rpx;background:rgba(255,255,255,.75);color:var(--color-warning-strong);font-size:21rpx}.activity-title{display:block;margin-top:28rpx;width:82%;font-size:40rpx;line-height:1.4;font-weight:700;color:var(--color-warning-strong)}.activity-slogan{display:block;margin-top:16rpx;font-size:24rpx;color:var(--color-warning-strong)}.body-text{font-size:27rpx;color:var(--color-text-secondary);line-height:1.8}.rule-row{display:flex;gap:18rpx;align-items:flex-start;padding:16rpx 0;font-size:26rpx}.rule-row>text:first-child{width:42rpx;height:42rpx;display:flex;align-items:center;justify-content:center;flex:none;border-radius:50%;background:var(--color-primary-light);color:var(--color-primary-strong);font-size:24rpx}.rule-row>text:last-child{padding-top:4rpx;line-height:1.55}
|
||||
@@ -1,170 +1,170 @@
|
||||
.page {
|
||||
padding: 32rpx;
|
||||
background: #FFF8F7;
|
||||
min-height: 100vh;
|
||||
padding:32rpx;
|
||||
background:var(--color-primary-lighter);
|
||||
min-height:100vh;
|
||||
}
|
||||
|
||||
.header {
|
||||
text-align: center;
|
||||
margin-bottom: 32rpx;
|
||||
text-align:center;
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
display: block;
|
||||
font-size:36rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
display:block;
|
||||
}
|
||||
|
||||
.activity-name {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
display: block;
|
||||
margin-top: 8rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
display:block;
|
||||
margin-top:8rpx;
|
||||
}
|
||||
|
||||
.section {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 32rpx;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
padding:32rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
display: block;
|
||||
margin-bottom: 20rpx;
|
||||
font-size:28rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
display:block;
|
||||
margin-bottom:20rpx;
|
||||
}
|
||||
|
||||
.radio-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:16rpx;
|
||||
}
|
||||
|
||||
.radio-item {
|
||||
padding: 24rpx;
|
||||
background: #F9F9F9;
|
||||
border-radius: 16rpx;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
border: 2rpx solid transparent;
|
||||
transition: all 0.2s;
|
||||
padding:24rpx;
|
||||
background:var(--color-bg-subtle);
|
||||
border-radius:16rpx;
|
||||
font-size:28rpx;
|
||||
color:var(--color-text-primary);
|
||||
border:2rpx solid transparent;
|
||||
transition:all 0.2s;
|
||||
}
|
||||
|
||||
.radio-item.active {
|
||||
background: #FFF3F2;
|
||||
border-color: #E96B6B;
|
||||
color: #E96B6B;
|
||||
background:var(--color-primary-light);
|
||||
border-color:var(--color-primary);
|
||||
color:var(--color-primary-strong);
|
||||
}
|
||||
|
||||
.participant-list {
|
||||
margin-top: 24rpx;
|
||||
padding-top: 24rpx;
|
||||
border-top: 1rpx solid #f0f0f0;
|
||||
margin-top:24rpx;
|
||||
padding-top:24rpx;
|
||||
border-top:1rpx solid var(--color-divider);
|
||||
}
|
||||
|
||||
.list-hint {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
display: block;
|
||||
margin-bottom: 16rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
display:block;
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.participant-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 16rpx 0;
|
||||
border-bottom: 1rpx solid #f5f5f5;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
padding:16rpx 0;
|
||||
border-bottom:1rpx solid var(--color-divider);
|
||||
}
|
||||
|
||||
.participant-item:last-child {
|
||||
border-bottom: none;
|
||||
border-bottom:none;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
border-radius: 32rpx;
|
||||
margin-right: 16rpx;
|
||||
background: #EEE;
|
||||
width:64rpx;
|
||||
height:64rpx;
|
||||
border-radius:32rpx;
|
||||
margin-right:16rpx;
|
||||
background:var(--color-bg-subtle);
|
||||
}
|
||||
|
||||
.name {
|
||||
flex: 1;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
flex:1;
|
||||
font-size:28rpx;
|
||||
color:var(--color-text-primary);
|
||||
}
|
||||
|
||||
.checkmark {
|
||||
color: #E96B6B;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color:var(--color-primary-strong);
|
||||
font-size:32rpx;
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
.btn-submit {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
border-radius: 44rpx;
|
||||
font-size: 30rpx;
|
||||
margin-top: 24rpx;
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
border-radius:44rpx;
|
||||
font-size:30rpx;
|
||||
margin-top:24rpx;
|
||||
}
|
||||
|
||||
.btn-submit[disabled] {
|
||||
background: #CCC;
|
||||
background:var(--color-bg-muted);
|
||||
}
|
||||
|
||||
.btn-skip {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
background: transparent;
|
||||
color: #999;
|
||||
border-radius: 44rpx;
|
||||
font-size: 28rpx;
|
||||
border: 1rpx solid #DDD;
|
||||
margin-top: 16rpx;
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
background:transparent;
|
||||
color:var(--color-text-tertiary);
|
||||
border-radius:44rpx;
|
||||
font-size:28rpx;
|
||||
border:1rpx solid var(--color-border-strong);
|
||||
margin-top:16rpx;
|
||||
}
|
||||
|
||||
/* 已提交状态 */
|
||||
.submitted {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 120rpx 32rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
padding:120rpx 32rpx;
|
||||
}
|
||||
|
||||
.success-icon {
|
||||
font-size: 80rpx;
|
||||
color: #E96B6B;
|
||||
margin-bottom: 24rpx;
|
||||
font-size:80rpx;
|
||||
color:var(--color-primary-strong);
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.success-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
margin-bottom: 16rpx;
|
||||
font-size:36rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.success-hint {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
margin-bottom: 48rpx;
|
||||
font-size:28rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
margin-bottom:48rpx;
|
||||
}
|
||||
|
||||
.btn-home {
|
||||
width: 80%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
border-radius: 44rpx;
|
||||
font-size: 30rpx;
|
||||
width:80%;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
border-radius:44rpx;
|
||||
font-size:30rpx;
|
||||
}
|
||||
|
||||
@@ -1,107 +1,107 @@
|
||||
.page {
|
||||
padding: 32rpx;
|
||||
background: #FFF8F7;
|
||||
min-height: 100vh;
|
||||
padding:32rpx;
|
||||
background:var(--color-primary-lighter);
|
||||
min-height:100vh;
|
||||
}
|
||||
|
||||
.header {
|
||||
text-align: center;
|
||||
margin-bottom: 32rpx;
|
||||
text-align:center;
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
display: block;
|
||||
font-size:36rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
display:block;
|
||||
}
|
||||
|
||||
.activity-name {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
display: block;
|
||||
margin-top: 8rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
display:block;
|
||||
margin-top:8rpx;
|
||||
}
|
||||
|
||||
.loading-state, .empty-state {
|
||||
text-align: center;
|
||||
padding: 100rpx 32rpx;
|
||||
color: #999;
|
||||
text-align:center;
|
||||
padding:100rpx 32rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.empty-icon {
|
||||
font-size: 80rpx;
|
||||
color: #E96B6B;
|
||||
display: block;
|
||||
margin-bottom: 24rpx;
|
||||
font-size:80rpx;
|
||||
color:var(--color-primary-strong);
|
||||
display:block;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.empty-hint {
|
||||
font-size: 24rpx;
|
||||
color: #BBB;
|
||||
display: block;
|
||||
margin-top: 16rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-disabled);
|
||||
display:block;
|
||||
margin-top:16rpx;
|
||||
}
|
||||
|
||||
.match-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:20rpx;
|
||||
}
|
||||
|
||||
.match-card {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.04);
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
padding:24rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
box-shadow:0 2rpx 12rpx rgba(0,0,0,0.04);
|
||||
}
|
||||
|
||||
.match-avatar {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 50rpx;
|
||||
background: #F0F0F0;
|
||||
flex-shrink: 0;
|
||||
width:100rpx;
|
||||
height:100rpx;
|
||||
border-radius:50rpx;
|
||||
background:var(--color-bg-subtle);
|
||||
flex-shrink:0;
|
||||
}
|
||||
|
||||
.match-info {
|
||||
flex: 1;
|
||||
margin-left: 24rpx;
|
||||
flex:1;
|
||||
margin-left:24rpx;
|
||||
}
|
||||
|
||||
.match-name {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
display: block;
|
||||
font-size:30rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
display:block;
|
||||
}
|
||||
|
||||
.match-meta {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
display: block;
|
||||
margin-top: 8rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
display:block;
|
||||
margin-top:8rpx;
|
||||
}
|
||||
|
||||
.btn-chat {
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
font-size: 24rpx;
|
||||
padding: 12rpx 28rpx;
|
||||
border-radius: 24rpx;
|
||||
border: none;
|
||||
line-height: 1.4;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
font-size:24rpx;
|
||||
padding:12rpx 28rpx;
|
||||
border-radius:24rpx;
|
||||
border:none;
|
||||
line-height:1.4;
|
||||
}
|
||||
|
||||
.btn-refresh {
|
||||
margin-top: 32rpx;
|
||||
background: transparent;
|
||||
color: #999;
|
||||
border: 1rpx solid #DDD;
|
||||
border-radius: 44rpx;
|
||||
height: 72rpx;
|
||||
line-height: 72rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
margin-top:32rpx;
|
||||
background:transparent;
|
||||
color:var(--color-text-tertiary);
|
||||
border:1rpx solid var(--color-border-strong);
|
||||
border-radius:44rpx;
|
||||
min-height:var(--tap-min);
|
||||
line-height:var(--tap-min);
|
||||
font-size:26rpx;
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
@@ -1,19 +1,19 @@
|
||||
.container { padding: 24rpx; min-height: 100vh; background: #f5f5f5; }
|
||||
.loading { text-align: center; padding: 80rpx; color: #999; }
|
||||
.empty { text-align: center; padding: 80rpx 0; }
|
||||
.empty-icon { font-size: 80rpx; display: block; margin-bottom: 20rpx; }
|
||||
.empty-text { font-size: 32rpx; color: #666; display: block; }
|
||||
.empty-hint { font-size: 26rpx; color: #999; display: block; margin-top: 12rpx; }
|
||||
.result-card { background: #fff; border-radius: 16rpx; padding: 24rpx; margin-bottom: 20rpx; box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.05); }
|
||||
.card-header { display: flex; align-items: center; margin-bottom: 16rpx; }
|
||||
.avatar { width: 80rpx; height: 80rpx; border-radius: 50rpx; background: #eee; }
|
||||
.info { flex: 1; margin-left: 20rpx; }
|
||||
.name { font-size: 30rpx; font-weight: bold; color: #333; display: block; }
|
||||
.status-badge { font-size: 22rpx; padding: 4rpx 12rpx; border-radius: 12rpx; margin-top: 8rpx; display: inline-block; }
|
||||
.badge-confirmed { background: #e8f5e9; color: #2e7d32; }
|
||||
.badge-waiting { background: #fff3e0; color: #e65100; }
|
||||
.card-body { margin-bottom: 16rpx; }
|
||||
.activity-name { font-size: 24rpx; color: #999; }
|
||||
.card-actions { display: flex; justify-content: flex-end; }
|
||||
.btn-waiting { background: #f5f5f5; color: #999; font-size: 26rpx; padding: 12rpx 32rpx; border-radius: 24rpx; border: none; }
|
||||
.btn-chat { background: linear-gradient(135deg, #FF6B6B, #EE5A24); color: #fff; font-size: 26rpx; padding: 12rpx 32rpx; border-radius: 24rpx; border: none; }
|
||||
.container { padding:24rpx; min-height:100vh; background:var(--color-bg-subtle); }
|
||||
.loading { text-align:center; padding:80rpx; color:var(--color-text-tertiary); }
|
||||
.empty { text-align:center; padding:80rpx 0; }
|
||||
.empty-icon { font-size:80rpx; display:block; margin-bottom:20rpx; }
|
||||
.empty-text { font-size:32rpx; color:var(--color-text-secondary); display:block; }
|
||||
.empty-hint { font-size:26rpx; color:var(--color-text-tertiary); display:block; margin-top:12rpx; }
|
||||
.result-card { background:var(--color-bg-card); border-radius:16rpx; padding:24rpx; margin-bottom:20rpx; box-shadow:0 2rpx 8rpx rgba(0,0,0,0.05); }
|
||||
.card-header { display:flex; align-items:center; margin-bottom:16rpx; }
|
||||
.avatar { width:80rpx; height:80rpx; border-radius:50rpx; background:var(--color-bg-subtle); }
|
||||
.info { flex:1; margin-left:20rpx; }
|
||||
.name { font-size:30rpx; font-weight:bold; color:var(--color-text-primary); display:block; }
|
||||
.status-badge { font-size:22rpx; padding:4rpx 12rpx; border-radius:12rpx; margin-top:8rpx; display:inline-block; }
|
||||
.badge-confirmed { background:var(--color-success-light); color:var(--color-success-strong); }
|
||||
.badge-waiting { background:var(--color-warning-light); color:var(--color-warning-strong); }
|
||||
.card-body { margin-bottom:16rpx; }
|
||||
.activity-name { font-size:24rpx; color:var(--color-text-tertiary); }
|
||||
.card-actions { display:flex; justify-content:flex-end; }
|
||||
.btn-waiting { background:var(--color-bg-subtle); color:var(--color-text-tertiary); font-size:26rpx; padding:12rpx 32rpx; border-radius:24rpx; border:none; }
|
||||
.btn-chat { background:var(--gradient-brand-solid); color:var(--color-text-inverse); font-size:26rpx; padding:12rpx 32rpx; border-radius:24rpx; border:none; }
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
.container { padding: 40rpx 24rpx; min-height: 100vh; background: #f5f5f5; display: flex; flex-direction: column; align-items: center; }
|
||||
.header { text-align: center; margin-bottom: 40rpx; }
|
||||
.avatar { width: 120rpx; height: 120rpx; border-radius: 60rpx; background: #eee; }
|
||||
.partner-name { font-size: 36rpx; font-weight: bold; color: #333; display: block; margin-top: 16rpx; }
|
||||
.status-section { background: #fff; border-radius: 20rpx; padding: 48rpx 40rpx; width: 100%; text-align: center; box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06); }
|
||||
.success-icon, .waiting-icon, .pending-icon { font-size: 72rpx; margin-bottom: 20rpx; }
|
||||
.success-title, .waiting-title, .pending-title { font-size: 34rpx; font-weight: bold; color: #333; display: block; margin-bottom: 12rpx; }
|
||||
.success-hint, .waiting-hint, .pending-hint { font-size: 26rpx; color: #888; display: block; margin-bottom: 32rpx; }
|
||||
.chat-btn, .confirm-btn { background: linear-gradient(135deg, #FF6B6B, #EE5A24); color: #fff; border: none; border-radius: 44rpx; font-size: 30rpx; padding: 16rpx 60rpx; }
|
||||
.decline-btn { background: #f5f5f5; color: #999; border: none; border-radius: 44rpx; font-size: 28rpx; padding: 16rpx 60rpx; margin-top: 20rpx; }
|
||||
.container { padding:40rpx 24rpx; min-height:100vh; background:var(--color-bg-subtle); display:flex; flex-direction:column; align-items:center; }
|
||||
.header { text-align:center; margin-bottom:40rpx; }
|
||||
.avatar { width:120rpx; height:120rpx; border-radius:60rpx; background:var(--color-bg-subtle); }
|
||||
.partner-name { font-size:36rpx; font-weight:bold; color:var(--color-text-primary); display:block; margin-top:16rpx; }
|
||||
.status-section { background:var(--color-bg-card); border-radius:20rpx; padding:48rpx 40rpx; width:100%; text-align:center; box-shadow:0 2rpx 12rpx rgba(0,0,0,0.06); }
|
||||
.success-icon, .waiting-icon, .pending-icon { font-size:72rpx; margin-bottom:20rpx; }
|
||||
.success-title, .waiting-title, .pending-title { font-size:34rpx; font-weight:bold; color:var(--color-text-primary); display:block; margin-bottom:12rpx; }
|
||||
.success-hint, .waiting-hint, .pending-hint { font-size:26rpx; color:var(--color-text-tertiary); display:block; margin-bottom:32rpx; }
|
||||
.chat-btn, .confirm-btn { background:var(--gradient-brand-solid); color:var(--color-text-inverse); border:none; border-radius:44rpx; font-size:30rpx; padding:16rpx 60rpx; }
|
||||
.decline-btn { background:var(--color-bg-subtle); color:var(--color-text-tertiary); border:none; border-radius:44rpx; font-size:28rpx; padding:16rpx 60rpx; margin-top:20rpx; }
|
||||
|
||||
@@ -1 +1 @@
|
||||
.page{padding:32rpx;background:#FFF8F7;min-height:100vh;text-align:center;color:#999;padding-top:200rpx;}
|
||||
.page{padding:32rpx;background:var(--color-primary-lighter);min-height:100vh;text-align:center;color:var(--color-text-tertiary);padding-top:200rpx;}
|
||||
|
||||
@@ -1 +1 @@
|
||||
.act-page{min-height:100vh;padding-bottom:40rpx;background:#F4F5FA}.activity-hero{padding:env(safe-area-inset-top) 24rpx 26rpx;border-radius:0 0 36rpx 36rpx;background:linear-gradient(160deg,var(--mini-night-start),var(--mini-night-end));box-shadow:var(--mini-shadow)}.activity-nav{position:relative;display:flex;align-items:center;justify-content:center;height:88rpx}.activity-title{color:#fff;font-size:31rpx;font-weight:700}.activity-calendar{position:absolute;right:0;display:flex;align-items:center;justify-content:center;width:62rpx;height:62rpx;border:1rpx solid rgba(255,255,255,.18);border-radius:31rpx;background:rgba(255,255,255,.1)}.activity-calendar image{width:34rpx;height:34rpx;filter:brightness(0) invert(1)}.activity-categories{white-space:nowrap}.activity-category-row{display:inline-flex;gap:12rpx}.activity-category{padding:11rpx 22rpx;border-radius:25rpx;background:rgba(255,255,255,.1);color:rgba(255,255,255,.72);font-size:20rpx}.activity-category.active{background:#fff;color:var(--mini-accent-pink);font-weight:650}.activity-heading{display:flex;align-items:flex-end;justify-content:space-between;padding:32rpx 28rpx 16rpx}.activity-heading>view{display:flex;flex-direction:column}.heading-title{color:#252A49;font-size:30rpx;font-weight:700}.heading-subtitle{margin-top:5rpx;color:#8A8FA4;font-size:20rpx}.my-activity-link{color:var(--mini-accent-pink);font-size:21rpx}.act-loading{padding:12rpx 24rpx}.act-list{display:flex;flex-direction:column;gap:20rpx;padding:8rpx 24rpx 0}.act-list__more{display:flex;justify-content:center;padding:24rpx 0}.act-list__end{text-align:center;padding:24rpx 0;color:#9A9EB0;font-size:20rpx}.act-empty{padding-top:70rpx}
|
||||
.act-page{min-height:100vh;padding-bottom:40rpx;background:var(--color-bg-page)}.activity-hero{padding:env(safe-area-inset-top) 24rpx 26rpx;border-radius:0 0 36rpx 36rpx;background:linear-gradient(160deg,var(--mini-night-start),var(--mini-night-end));box-shadow:var(--mini-shadow)}.activity-nav{position:relative;display:flex;align-items:center;justify-content:center;height:88rpx}.activity-title{color:var(--color-text-inverse);font-size:31rpx;font-weight:700}.activity-calendar{position:absolute;right:0;display:flex;align-items:center;justify-content:center;width:62rpx;height:62rpx;border:1rpx solid rgba(255,255,255,.18);border-radius:31rpx;background:rgba(255,255,255,.1)}.activity-calendar image{width:34rpx;height:34rpx;filter:brightness(0) invert(1)}.activity-categories{white-space:nowrap}.activity-category-row{display:inline-flex;gap:12rpx}.activity-category{padding:11rpx 22rpx;border-radius:25rpx;background:rgba(255,255,255,.1);color:rgba(255,255,255,.72);font-size:24rpx}.activity-category.active{background:var(--color-bg-card);color:var(--color-primary-strong);font-weight:600}.activity-heading{display:flex;align-items:flex-end;justify-content:space-between;padding:32rpx 28rpx 16rpx}.activity-heading>view{display:flex;flex-direction:column}.heading-title{color:var(--color-text-strong);font-size:30rpx;font-weight:700}.heading-subtitle{margin-top:5rpx;color:var(--color-text-tertiary);font-size:24rpx}.my-activity-link{color:var(--color-primary-strong);font-size:24rpx}.act-loading{padding:12rpx 24rpx}.act-list{display:flex;flex-direction:column;gap:20rpx;padding:8rpx 24rpx 0}.act-list__more{display:flex;justify-content:center;padding:24rpx 0}.act-list__end{text-align:center;padding:24rpx 0;color:var(--color-text-tertiary);font-size:24rpx}.act-empty{padding-top:70rpx}
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
@import "../../styles/service-page.wxss";
|
||||
.risk-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16rpx;margin-top:18rpx}.risk-card{display:flex;min-height:174rpx;flex-direction:column;padding:20rpx;border:1rpx solid #F7DCE2;border-radius:24rpx;background:#FFF9FA}.risk-card image{width:42rpx;height:42rpx}.risk-title{margin-top:10rpx;color:#9E4054;font-size:23rpx;font-weight:650}.risk-desc{margin-top:7rpx;color:#846F78;font-size:18rpx;line-height:1.5}.safety-steps{overflow:hidden;margin-top:18rpx;border-radius:24rpx;background:#fff;box-shadow:0 8rpx 26rpx rgba(35,35,95,.06)}.safety-step{display:flex;align-items:center;gap:16rpx;min-height:104rpx;padding:16rpx 20rpx;border-bottom:1rpx solid #EFF0F5}.safety-step:last-child{border-bottom:0}.safety-step>image{width:48rpx;height:48rpx;flex:none}.safety-step>view{display:flex;flex:1;flex-direction:column}.safety-step view text:first-child{color:#303654;font-size:23rpx;font-weight:650}.safety-step view text:last-child{margin-top:5rpx;color:#858A9E;font-size:19rpx;line-height:1.45}
|
||||
.risk-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16rpx;margin-top:18rpx}.risk-card{display:flex;min-height:174rpx;flex-direction:column;padding:20rpx;border:1rpx solid var(--color-primary-light);border-radius:24rpx;background:var(--color-bg-page)}.risk-card image{width:42rpx;height:42rpx}.risk-title{margin-top:10rpx;color:var(--color-primary-strong);font-size:24rpx;font-weight:600}.risk-desc{margin-top:7rpx;color:var(--color-text-tertiary);font-size:24rpx;line-height:1.5}.safety-steps{overflow:hidden;margin-top:18rpx;border-radius:24rpx;background:var(--color-bg-card);box-shadow:0 8rpx 26rpx rgba(35,35,95,.06)}.safety-step{display:flex;align-items:center;gap:16rpx;min-height:104rpx;padding:16rpx 20rpx;border-bottom:1rpx solid var(--color-divider)}.safety-step:last-child{border-bottom:0}.safety-step>image{width:48rpx;height:48rpx;flex:none}.safety-step>view{display:flex;flex:1;flex-direction:column}.safety-step view text:first-child{color:var(--color-text-strong);font-size:24rpx;font-weight:600}.safety-step view text:last-child{margin-top:5rpx;color:var(--color-text-tertiary);font-size:24rpx;line-height:1.45}
|
||||
|
||||
+126
-126
@@ -1,209 +1,209 @@
|
||||
/* 申诉提交页 — Design Tokens */
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #FFF8F7;
|
||||
min-height:100vh;
|
||||
background:var(--color-primary-lighter);
|
||||
}
|
||||
|
||||
.body {
|
||||
padding: 24rpx;
|
||||
box-sizing: border-box;
|
||||
padding:24rpx;
|
||||
box-sizing:border-box;
|
||||
}
|
||||
|
||||
/* 介绍卡片 */
|
||||
.intro-card {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 32rpx;
|
||||
margin-bottom: 24rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
border-left: 8rpx solid #E96B6B;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
padding:32rpx;
|
||||
margin-bottom:24rpx;
|
||||
box-shadow:0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
border-left:8rpx solid var(--color-primary);
|
||||
}
|
||||
|
||||
.intro-title {
|
||||
display: block;
|
||||
font-size: 34rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
margin-bottom: 12rpx;
|
||||
display:block;
|
||||
font-size:34rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
margin-bottom:12rpx;
|
||||
}
|
||||
|
||||
.intro-subtitle {
|
||||
display: block;
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
line-height: 1.5;
|
||||
display:block;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
line-height:1.5;
|
||||
}
|
||||
|
||||
/* 卡片 */
|
||||
.card {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 24rpx 32rpx;
|
||||
margin-bottom: 24rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
padding:24rpx 32rpx;
|
||||
margin-bottom:24rpx;
|
||||
box-shadow:0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
/* 证据 */
|
||||
.evidence-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 16rpx;
|
||||
margin-top: 16rpx;
|
||||
display:flex;
|
||||
flex-wrap:wrap;
|
||||
gap:16rpx;
|
||||
margin-top:16rpx;
|
||||
}
|
||||
|
||||
.evidence-item {
|
||||
position: relative;
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 12rpx;
|
||||
overflow: hidden;
|
||||
position:relative;
|
||||
width:160rpx;
|
||||
height:160rpx;
|
||||
border-radius:12rpx;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.evidence-item image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
|
||||
.remove-btn {
|
||||
position: absolute;
|
||||
top: 4rpx;
|
||||
right: 4rpx;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
line-height: 32rpx;
|
||||
text-align: center;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
color: #fff;
|
||||
border-radius: 50%;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
position:absolute;
|
||||
top:4rpx;
|
||||
right:4rpx;
|
||||
width:36rpx;
|
||||
min-height:var(--tap-min);
|
||||
line-height:var(--tap-min);
|
||||
text-align:center;
|
||||
background:rgba(0, 0, 0, 0.5);
|
||||
color:var(--color-text-inverse);
|
||||
border-radius:50%;
|
||||
font-size:24rpx;
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
.evidence-add {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 12rpx;
|
||||
background: #F7F8FA;
|
||||
border: 2rpx dashed #D0D0D0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #999;
|
||||
width:160rpx;
|
||||
height:160rpx;
|
||||
border-radius:12rpx;
|
||||
background:var(--color-bg-subtle);
|
||||
border:2rpx dashed var(--color-border-strong);
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.add-icon {
|
||||
font-size: 48rpx;
|
||||
color: #B0B0B0;
|
||||
line-height: 1;
|
||||
font-size:48rpx;
|
||||
color:var(--color-text-disabled);
|
||||
line-height:1;
|
||||
}
|
||||
|
||||
.add-text {
|
||||
font-size: 22rpx;
|
||||
margin-top: 8rpx;
|
||||
font-size:24rpx;
|
||||
margin-top:8rpx;
|
||||
}
|
||||
|
||||
/* 联系方式输入 */
|
||||
.contact-input {
|
||||
margin-top: 16rpx;
|
||||
background: #F7F8FA;
|
||||
border-radius: 12rpx;
|
||||
padding: 24rpx;
|
||||
font-size: 28rpx;
|
||||
min-height: 40rpx;
|
||||
}
|
||||
margin-top:16rpx;
|
||||
background:var(--color-bg-subtle);
|
||||
border-radius:12rpx;
|
||||
padding:24rpx;
|
||||
font-size:28rpx;
|
||||
min-height:var(--tap-min);
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
/* 提交按钮 */
|
||||
.btn-submit {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
border-radius: 44rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
border: none;
|
||||
margin-top: 8rpx;
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
border-radius:44rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
font-size:32rpx;
|
||||
border:none;
|
||||
margin-top:8rpx;
|
||||
}
|
||||
|
||||
.btn-submit::after {
|
||||
border: none;
|
||||
border:none;
|
||||
}
|
||||
|
||||
.btn-submit[disabled] {
|
||||
opacity: 0.5;
|
||||
opacity:0.5;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
width: 80%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
border-radius: 44rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
border: none;
|
||||
margin-top: 48rpx;
|
||||
width:80%;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
border-radius:44rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
font-size:32rpx;
|
||||
border:none;
|
||||
margin-top:48rpx;
|
||||
}
|
||||
|
||||
.btn-primary::after {
|
||||
border: none;
|
||||
border:none;
|
||||
}
|
||||
|
||||
.hint {
|
||||
display: block;
|
||||
text-align: center;
|
||||
font-size: 22rpx;
|
||||
color: #B0B0B0;
|
||||
margin-top: 20rpx;
|
||||
padding: 0 24rpx;
|
||||
display:block;
|
||||
text-align:center;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-disabled);
|
||||
margin-top:20rpx;
|
||||
padding:0 24rpx;
|
||||
}
|
||||
|
||||
/* 成功态 */
|
||||
.success-wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 120rpx 48rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
padding:120rpx 48rpx;
|
||||
}
|
||||
|
||||
.success-icon {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
line-height: 120rpx;
|
||||
text-align: center;
|
||||
border-radius: 50%;
|
||||
background: #E8F5E9;
|
||||
color: #1A6B3E;
|
||||
font-size: 64rpx;
|
||||
margin-bottom: 32rpx;
|
||||
width:120rpx;
|
||||
height:120rpx;
|
||||
line-height:120rpx;
|
||||
text-align:center;
|
||||
border-radius:50%;
|
||||
background:var(--color-success-light);
|
||||
color:var(--color-success-strong);
|
||||
font-size:64rpx;
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.success-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
margin-bottom: 16rpx;
|
||||
font-size:36rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.success-hint {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
text-align: center;
|
||||
line-height: 1.6;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
text-align:center;
|
||||
line-height:1.6;
|
||||
}
|
||||
|
||||
/* 公益免费标识 */
|
||||
.free-badge {
|
||||
text-align: center;
|
||||
padding: 24rpx;
|
||||
margin-top: 16rpx;
|
||||
text-align:center;
|
||||
padding:24rpx;
|
||||
margin-top:16rpx;
|
||||
}
|
||||
|
||||
.free-badge text {
|
||||
display: inline-block;
|
||||
font-size: 22rpx;
|
||||
color: #1A6B3E;
|
||||
background: #E8F5E9;
|
||||
padding: 8rpx 24rpx;
|
||||
border-radius: 24rpx;
|
||||
display:inline-block;
|
||||
font-size:22rpx;
|
||||
color:var(--color-success-strong);
|
||||
background:var(--color-success-light);
|
||||
padding:8rpx 24rpx;
|
||||
border-radius:24rpx;
|
||||
}
|
||||
|
||||
@@ -1 +1 @@
|
||||
.page{padding:32rpx;background:#FFF8F7;min-height:100vh;text-align:center;padding-top:200rpx;color:#999;}
|
||||
.page{padding:32rpx;background:var(--color-primary-lighter);min-height:100vh;text-align:center;padding-top:200rpx;color:var(--color-text-tertiary);}
|
||||
|
||||
@@ -1,72 +1,72 @@
|
||||
/* 黑名单管理页 — Design Tokens */
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #FFF8F7;
|
||||
min-height:100vh;
|
||||
background:var(--color-primary-lighter);
|
||||
}
|
||||
|
||||
.body {
|
||||
padding: 24rpx;
|
||||
box-sizing: border-box;
|
||||
padding:24rpx;
|
||||
box-sizing:border-box;
|
||||
}
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:16rpx;
|
||||
}
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 24rpx;
|
||||
gap: 20rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
display:flex;
|
||||
align-items:center;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
padding:24rpx;
|
||||
gap:20rpx;
|
||||
box-shadow:0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
.info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
flex:1;
|
||||
min-width:0;
|
||||
}
|
||||
|
||||
.name {
|
||||
display: block;
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
margin-bottom: 6rpx;
|
||||
display:block;
|
||||
font-size:30rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
margin-bottom:6rpx;
|
||||
}
|
||||
|
||||
.meta {
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin-bottom: 4rpx;
|
||||
display:block;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
margin-bottom:4rpx;
|
||||
}
|
||||
|
||||
.reason {
|
||||
display: block;
|
||||
font-size: 22rpx;
|
||||
color: #B0B0B0;
|
||||
display:block;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-disabled);
|
||||
}
|
||||
|
||||
.btn-unblock {
|
||||
flex-shrink: 0;
|
||||
height: 64rpx;
|
||||
line-height: 60rpx;
|
||||
padding: 0 28rpx;
|
||||
border-radius: 32rpx;
|
||||
font-size: 24rpx;
|
||||
background: #fff;
|
||||
color: #E96B6B;
|
||||
border: 2rpx solid #E96B6B;
|
||||
}
|
||||
flex-shrink:0;
|
||||
min-height:var(--tap-min);
|
||||
line-height:var(--tap-min);
|
||||
padding:0 28rpx;
|
||||
border-radius:32rpx;
|
||||
font-size:24rpx;
|
||||
background:var(--color-bg-card);
|
||||
color:var(--color-primary-strong);
|
||||
border:2rpx solid var(--color-primary);
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
.btn-unblock::after {
|
||||
border: none;
|
||||
border:none;
|
||||
}
|
||||
|
||||
.btn-unblock.disabled {
|
||||
opacity: 0.5;
|
||||
opacity:0.5;
|
||||
}
|
||||
|
||||
@@ -2,77 +2,77 @@
|
||||
* 聊天详情页样式(重构后大幅简化,气泡主体样式封装在 ui-message-bubble 内)
|
||||
*/
|
||||
.page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
background: var(--color-bg-page);
|
||||
box-sizing: border-box;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
height:100vh;
|
||||
background:var(--color-bg-page);
|
||||
box-sizing:border-box;
|
||||
}
|
||||
|
||||
/* 右上角更多按钮 */
|
||||
.more-btn {
|
||||
font-size: 40rpx;
|
||||
color: var(--color-text-secondary);
|
||||
padding: 0 var(--spacing-2);
|
||||
line-height: 1;
|
||||
font-size:40rpx;
|
||||
color:var(--color-text-secondary);
|
||||
padding:0 var(--spacing-2);
|
||||
line-height:1;
|
||||
}
|
||||
|
||||
/* 安全提示 */
|
||||
.safety-tip {
|
||||
background: var(--color-warning-light);
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
font-size: var(--font-size-xs);
|
||||
color: var(--color-warning);
|
||||
text-align: center;
|
||||
line-height: var(--line-height-normal);
|
||||
background:var(--color-warning-light);
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
font-size:var(--font-size-xs);
|
||||
color:var(--color-warning-strong);
|
||||
text-align:center;
|
||||
line-height:var(--line-height-normal);
|
||||
}
|
||||
|
||||
/* 消息列表 */
|
||||
.msg-list {
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
box-sizing: border-box;
|
||||
padding: var(--spacing-2) 0;
|
||||
flex:1;
|
||||
min-height:0;
|
||||
box-sizing:border-box;
|
||||
padding:var(--spacing-2) 0;
|
||||
}
|
||||
|
||||
.load-more-hint {
|
||||
text-align: center;
|
||||
padding: var(--spacing-2);
|
||||
color: var(--color-text-tertiary);
|
||||
font-size: var(--font-size-xs);
|
||||
text-align:center;
|
||||
padding:var(--spacing-2);
|
||||
color:var(--color-text-tertiary);
|
||||
font-size:var(--font-size-xs);
|
||||
}
|
||||
|
||||
/* 输入栏 */
|
||||
.input-bar {
|
||||
background: var(--color-bg-card);
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom: calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
border-top: var(--border-width) solid var(--color-border);
|
||||
background:var(--color-bg-card);
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom:calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
border-top:var(--border-width) solid var(--color-border);
|
||||
}
|
||||
|
||||
.input-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--spacing-2);
|
||||
display:flex;
|
||||
align-items:center;
|
||||
gap:var(--spacing-2);
|
||||
}
|
||||
|
||||
.input {
|
||||
flex: 1;
|
||||
height: 72rpx;
|
||||
background: var(--color-bg-page);
|
||||
border-radius: var(--radius-full);
|
||||
padding: 0 var(--spacing-3);
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
flex:1;
|
||||
height:72rpx;
|
||||
background:var(--color-bg-page);
|
||||
border-radius:var(--radius-full);
|
||||
padding:0 var(--spacing-3);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
}
|
||||
|
||||
/* 会话已停用 */
|
||||
.blocked-tip {
|
||||
background: var(--color-bg-card);
|
||||
text-align: center;
|
||||
padding: var(--spacing-5) var(--spacing-page-x);
|
||||
padding-bottom: calc(var(--spacing-5) + env(safe-area-inset-bottom));
|
||||
color: var(--color-text-tertiary);
|
||||
font-size: var(--font-size-sm);
|
||||
border-top: var(--border-width) solid var(--color-border);
|
||||
background:var(--color-bg-card);
|
||||
text-align:center;
|
||||
padding:var(--spacing-5) var(--spacing-page-x);
|
||||
padding-bottom:calc(var(--spacing-5) + env(safe-area-inset-bottom));
|
||||
color:var(--color-text-tertiary);
|
||||
font-size:var(--font-size-sm);
|
||||
border-top:var(--border-width) solid var(--color-border);
|
||||
}
|
||||
|
||||
@@ -1,140 +1,140 @@
|
||||
.page {
|
||||
padding: 32rpx;
|
||||
background: #FFF8F7;
|
||||
min-height: 100vh;
|
||||
padding:32rpx;
|
||||
background:var(--color-primary-lighter);
|
||||
min-height:100vh;
|
||||
}
|
||||
|
||||
.header {
|
||||
text-align: center;
|
||||
margin-bottom: 32rpx;
|
||||
text-align:center;
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
font-size:36rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
}
|
||||
|
||||
.loading-state, .error-state {
|
||||
text-align: center;
|
||||
padding: 80rpx;
|
||||
color: #999;
|
||||
text-align:center;
|
||||
padding:80rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.checkin-card {
|
||||
background: #fff;
|
||||
border-radius: 24rpx;
|
||||
padding: 40rpx;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:24rpx;
|
||||
padding:40rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.activity-info {
|
||||
text-align: center;
|
||||
margin-bottom: 32rpx;
|
||||
text-align:center;
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.activity-title {
|
||||
display: block;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
margin-bottom: 8rpx;
|
||||
display:block;
|
||||
font-size:32rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
margin-bottom:8rpx;
|
||||
}
|
||||
|
||||
.activity-location {
|
||||
display: block;
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
display:block;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.qr-section {
|
||||
text-align: center;
|
||||
padding: 32rpx 0;
|
||||
border-top: 1rpx solid #f5f5f5;
|
||||
border-bottom: 1rpx solid #f5f5f5;
|
||||
margin-bottom: 32rpx;
|
||||
text-align:center;
|
||||
padding:32rpx 0;
|
||||
border-top:1rpx solid var(--color-divider);
|
||||
border-bottom:1rpx solid var(--color-divider);
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.qr-placeholder {
|
||||
width: 300rpx;
|
||||
height: 300rpx;
|
||||
margin: 0 auto 20rpx;
|
||||
background: #F5F5F5;
|
||||
border-radius: 16rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width:300rpx;
|
||||
height:300rpx;
|
||||
margin:0 auto 20rpx;
|
||||
background:var(--color-bg-subtle);
|
||||
border-radius:16rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
}
|
||||
|
||||
.qr-icon {
|
||||
font-size: 120rpx;
|
||||
color: #CCC;
|
||||
font-size:120rpx;
|
||||
color:var(--color-text-disabled);
|
||||
}
|
||||
|
||||
.qr-hint {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.token-section {
|
||||
margin-bottom: 24rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.token-label {
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
display: block;
|
||||
margin-bottom: 12rpx;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-secondary);
|
||||
display:block;
|
||||
margin-bottom:12rpx;
|
||||
}
|
||||
|
||||
.token-value {
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: #333;
|
||||
background: #F5F5F5;
|
||||
padding: 20rpx;
|
||||
border-radius: 12rpx;
|
||||
word-break: break-all;
|
||||
margin-bottom: 16rpx;
|
||||
display:block;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-primary);
|
||||
background:var(--color-bg-subtle);
|
||||
padding:20rpx;
|
||||
border-radius:12rpx;
|
||||
word-break:break-all;
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.btn-copy {
|
||||
width: 100%;
|
||||
height: 72rpx;
|
||||
line-height: 72rpx;
|
||||
background: #FFF3F2;
|
||||
color: #E96B6B;
|
||||
border-radius: 36rpx;
|
||||
font-size: 26rpx;
|
||||
border: none;
|
||||
}
|
||||
width:100%;
|
||||
min-height:var(--tap-min);
|
||||
line-height:var(--tap-min);
|
||||
background:var(--color-primary-light);
|
||||
color:var(--color-primary-strong);
|
||||
border-radius:36rpx;
|
||||
font-size:26rpx;
|
||||
border:none;
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
.expire-info {
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
color: #E59A32;
|
||||
padding: 16rpx;
|
||||
background: #FFF8E1;
|
||||
border-radius: 12rpx;
|
||||
text-align:center;
|
||||
font-size:24rpx;
|
||||
color:var(--color-warning-strong);
|
||||
padding:16rpx;
|
||||
background:var(--color-warning-light);
|
||||
border-radius:12rpx;
|
||||
}
|
||||
|
||||
.btn-refresh-page {
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
border-radius: 44rpx;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
font-size: 30rpx;
|
||||
margin-top: 24rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
border-radius:44rpx;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
font-size:30rpx;
|
||||
margin-top:24rpx;
|
||||
}
|
||||
|
||||
.btn-refresh {
|
||||
margin-top: 24rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
border-radius: 44rpx;
|
||||
height: 72rpx;
|
||||
line-height: 72rpx;
|
||||
font-size: 28rpx;
|
||||
border: none;
|
||||
}
|
||||
margin-top:24rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
border-radius:44rpx;
|
||||
min-height:var(--tap-min);
|
||||
line-height:var(--tap-min);
|
||||
font-size:28rpx;
|
||||
border:none;
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
@import "../../styles/service-page.wxss";
|
||||
.content-page{min-height:100vh;padding-bottom:40rpx;background:#F4F5FA}.content-categories{padding:24rpx 0;white-space:nowrap}.content-category-row{display:inline-flex;gap:12rpx;padding:0 24rpx}.content-category{padding:11rpx 22rpx;border-radius:24rpx;background:#fff;color:#767D96;font-size:21rpx;box-shadow:0 6rpx 18rpx rgba(35,35,95,.05)}.content-category.active{background:linear-gradient(135deg,var(--mini-accent-coral),var(--mini-accent-pink));color:#fff;font-weight:650}.content-list{padding:0 24rpx}.content-card{display:flex;align-items:center;overflow:hidden;min-height:150rpx;margin-bottom:16rpx;border-radius:24rpx;background:#fff;box-shadow:0 8rpx 26rpx rgba(35,35,95,.06)}.content-cover{width:176rpx;height:150rpx;flex:none}.content-card__body{display:flex;flex:1;min-width:0;flex-direction:column;padding:16rpx}.content-card__category{align-self:flex-start;padding:4rpx 10rpx;border-radius:12rpx;background:#FFF0F5;color:var(--mini-accent-pink);font-size:17rpx}.content-card__title{overflow:hidden;margin-top:8rpx;color:#283056;font-size:24rpx;font-weight:650;white-space:nowrap;text-overflow:ellipsis}.content-card__summary{overflow:hidden;margin-top:5rpx;color:#83899F;font-size:18rpx;white-space:nowrap;text-overflow:ellipsis}.content-card__meta{display:flex;gap:18rpx;margin-top:9rpx;color:#9A9EB0;font-size:17rpx}.content-card__arrow{width:24rpx;height:24rpx;margin-right:16rpx;flex:none}
|
||||
.content-page{min-height:100vh;padding-bottom:40rpx;background:var(--color-bg-page)}.content-categories{padding:24rpx 0;white-space:nowrap}.content-category-row{display:inline-flex;gap:12rpx;padding:0 24rpx}.content-category{padding:11rpx 22rpx;border-radius:24rpx;background:var(--color-bg-card);color:var(--color-text-tertiary);font-size:24rpx;box-shadow:0 6rpx 18rpx rgba(35,35,95,.05)}.content-category.active{background:var(--gradient-brand-solid);color:var(--color-text-inverse);font-weight:600}.content-list{padding:0 24rpx}.content-card{display:flex;align-items:center;overflow:hidden;min-height:150rpx;margin-bottom:16rpx;border-radius:24rpx;background:var(--color-bg-card);box-shadow:0 8rpx 26rpx rgba(35,35,95,.06)}.content-cover{width:176rpx;height:150rpx;flex:none}.content-card__body{display:flex;flex:1;min-width:0;flex-direction:column;padding:16rpx}.content-card__category{align-self:flex-start;padding:4rpx 10rpx;border-radius:12rpx;background:var(--color-primary-light);color:var(--color-primary-strong);font-size:24rpx}.content-card__title{overflow:hidden;margin-top:8rpx;color:var(--color-text-strong);font-size:24rpx;font-weight:600;white-space:nowrap;text-overflow:ellipsis}.content-card__summary{overflow:hidden;margin-top:5rpx;color:var(--color-text-tertiary);font-size:24rpx;white-space:nowrap;text-overflow:ellipsis}.content-card__meta{display:flex;gap:18rpx;margin-top:9rpx;color:var(--color-text-tertiary);font-size:24rpx}.content-card__arrow{width:24rpx;height:24rpx;margin-right:16rpx;flex:none}
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
.container { padding: 24rpx; }
|
||||
.form-section { background: #fff; border-radius: 16rpx; padding: 24rpx; }
|
||||
.form-group { padding: 20rpx 0; border-bottom: 1rpx solid #f5f5f5; }
|
||||
.form-group:last-child { border-bottom: none; }
|
||||
.label { font-size: 28rpx; color: #666; display: block; margin-bottom: 12rpx; }
|
||||
.value { font-size: 30rpx; color: #333; }
|
||||
.picker-value { font-size: 30rpx; color: #333; }
|
||||
.input { font-size: 30rpx; color: #333; }
|
||||
.textarea { font-size: 30rpx; color: #333; width: 100%; height: 160rpx; }
|
||||
.submit-btn { margin-top: 40rpx; background: linear-gradient(135deg, #FF6B6B, #EE5A24); color: #fff; border: none; border-radius: 44rpx; font-size: 32rpx; }
|
||||
.tip { display: block; text-align: center; font-size: 24rpx; color: #999; margin-top: 20rpx; }
|
||||
.container { padding:24rpx; }
|
||||
.form-section { background:var(--color-bg-card); border-radius:16rpx; padding:24rpx; }
|
||||
.form-group { padding:20rpx 0; border-bottom:1rpx solid var(--color-divider); }
|
||||
.form-group:last-child { border-bottom:none; }
|
||||
.label { font-size:28rpx; color:var(--color-text-secondary); display:block; margin-bottom:12rpx; }
|
||||
.value { font-size:30rpx; color:var(--color-text-primary); }
|
||||
.picker-value { font-size:30rpx; color:var(--color-text-primary); }
|
||||
.input { font-size:30rpx; color:var(--color-text-primary); }
|
||||
.textarea { font-size:30rpx; color:var(--color-text-primary); width:100%; height:160rpx; }
|
||||
.submit-btn { margin-top:40rpx; background:var(--gradient-brand-solid); color:var(--color-text-inverse); border:none; border-radius:44rpx; font-size:32rpx; }
|
||||
.tip { display:block; text-align:center; font-size:24rpx; color:var(--color-text-tertiary); margin-top:20rpx; }
|
||||
|
||||
@@ -1,47 +1,47 @@
|
||||
.page{min-height:100vh;background:#F4F5FA}
|
||||
.page{min-height:100vh;background:var(--color-bg-page)}
|
||||
.discover-hero{padding:env(safe-area-inset-top) 24rpx 24rpx;background:linear-gradient(160deg,var(--mini-night-start),var(--mini-night-end));border-radius:0 0 34rpx 34rpx;box-shadow:var(--mini-shadow);position:relative;z-index:1}
|
||||
.discover-nav{height:88rpx;display:flex;align-items:center;justify-content:center;position:relative;color:#fff}
|
||||
.discover-nav{height:88rpx;display:flex;align-items:center;justify-content:center;position:relative;color:var(--color-text-inverse)}
|
||||
.nav-title{font-size:31rpx;font-weight:700}
|
||||
.nav-search{position:absolute;right:0;width:64rpx;height:64rpx;display:flex;align-items:center;justify-content:center;border:1rpx solid rgba(255,255,255,.18);border-radius:32rpx;background:rgba(255,255,255,.08)}
|
||||
.nav-search image{width:38rpx;height:38rpx;filter:brightness(0) invert(1)}
|
||||
.search-bar{display:flex;align-items:center}
|
||||
.search-input{height:70rpx;flex:1;display:flex;align-items:center;padding:0 20rpx;border-radius:35rpx;background:rgba(255,255,255,.12);border:1rpx solid rgba(255,255,255,.14)}
|
||||
.search-label{margin-right:14rpx;padding-right:14rpx;border-right:1rpx solid rgba(255,255,255,.2);font-size:20rpx;color:#fff}
|
||||
.search-field{flex:1;font-size:23rpx;color:#fff}
|
||||
.search-placeholder{font-size:23rpx;color:rgba(255,255,255,.52)}
|
||||
.search-label{margin-right:14rpx;padding-right:14rpx;border-right:1rpx solid rgba(255,255,255,.2);font-size:24rpx;color:var(--color-text-inverse)}
|
||||
.search-field{flex:1;font-size:24rpx;color:var(--color-text-inverse)}
|
||||
.search-placeholder{font-size:24rpx;color:rgba(255,255,255,.52)}
|
||||
.filter-scroll{margin-top:16rpx;white-space:nowrap}
|
||||
.filter-chips{display:inline-flex;gap:12rpx}
|
||||
.filter-chip{padding:11rpx 20rpx;border-radius:25rpx;background:rgba(255,255,255,.1);color:rgba(255,255,255,.72);font-size:20rpx}
|
||||
.filter-chip.active{background:#fff;color:var(--mini-accent-pink);font-weight:650}
|
||||
.filter-chip{padding:11rpx 20rpx;border-radius:25rpx;background:rgba(255,255,255,.1);color:rgba(255,255,255,.72);font-size:24rpx}
|
||||
.filter-chip.active{background:var(--color-bg-card);color:var(--color-primary-strong);font-weight:600}
|
||||
|
||||
/* 遮罩层 + 底部抽屉样式 */
|
||||
.filter-mask{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.35);z-index:10}
|
||||
.filter-panel-wrap{position:fixed;left:0;right:0;bottom:0;z-index:11;background:#fff;border-radius:28rpx 28rpx 0 0;max-height:78vh;box-shadow:0 -10rpx 40rpx rgba(31,32,89,.15);display:flex;flex-direction:column;padding:24rpx 28rpx 28rpx}
|
||||
.filter-panel-wrap{position:fixed;left:0;right:0;bottom:0;z-index:11;background:var(--color-bg-card);border-radius:28rpx 28rpx 0 0;max-height:78vh;box-shadow:0 -10rpx 40rpx rgba(31,32,89,.15);display:flex;flex-direction:column;padding:24rpx 28rpx 28rpx}
|
||||
.filter-scroll-wrap{flex:1;max-height:calc(78vh - 140rpx);padding:8rpx 0 0}
|
||||
.filter-section{margin-bottom:28rpx;padding:16rpx 20rpx;border-radius:16rpx;transition:background .2s,box-shadow .2s}
|
||||
.filter-section.hl{background:#FFF5F8;box-shadow:inset 0 0 0 2rpx var(--mini-accent-pink)}
|
||||
.filter-section.hl{background:var(--color-primary-light);box-shadow:inset 0 0 0 2rpx var(--mini-accent-pink)}
|
||||
.filter-heading{display:flex;justify-content:space-between}
|
||||
.filter-label{display:block;font-size:24rpx;font-weight:650;color:#282D4E}
|
||||
.filter-value{font-size:21rpx;color:#777E99}
|
||||
.filter-label{display:block;font-size:24rpx;font-weight:600;color:var(--color-text-strong)}
|
||||
.filter-value{font-size:24rpx;color:var(--color-text-tertiary)}
|
||||
.range-slider{margin:8rpx 0}
|
||||
.tag-group{display:flex;flex-wrap:wrap;gap:14rpx;margin-top:16rpx}
|
||||
.tag{padding:10rpx 22rpx;border-radius:22rpx;background:#F1F2F7;color:#626981;font-size:21rpx}
|
||||
.tag.selected{background:#FCEBF3;color:var(--mini-accent-pink)}
|
||||
.tag{padding:10rpx 22rpx;border-radius:22rpx;background:var(--color-bg-subtle);color:var(--color-text-secondary);font-size:24rpx}
|
||||
.tag.selected{background:var(--color-primary-light);color:var(--color-primary-strong)}
|
||||
.filter-actions{display:flex;gap:18rpx;margin-top:8rpx}
|
||||
|
||||
.result-head{padding:30rpx 26rpx 16rpx;display:flex;align-items:flex-end;justify-content:space-between}
|
||||
.result-head>view{display:flex;flex-direction:column}
|
||||
.result-title{font-size:30rpx;font-weight:700;color:#252A49}
|
||||
.result-subtitle{margin-top:5rpx;font-size:20rpx;color:#8A8FA4}
|
||||
.result-count{font-size:20rpx;color:#8A8FA4}
|
||||
.user-list{margin:0 24rpx;padding:4rpx 0;background:#fff;border-radius:28rpx;overflow:hidden;box-shadow:0 10rpx 32rpx rgba(34,35,91,.08)}
|
||||
.result-title{font-size:30rpx;font-weight:700;color:var(--color-text-strong)}
|
||||
.result-subtitle{margin-top:5rpx;font-size:24rpx;color:var(--color-text-tertiary)}
|
||||
.result-count{font-size:20rpx;color:var(--color-text-tertiary)}
|
||||
.user-list{margin:0 24rpx;padding:4rpx 0;background:var(--color-bg-card);border-radius:28rpx;overflow:hidden;box-shadow:0 10rpx 32rpx rgba(34,35,91,.08)}
|
||||
.card-action{display:flex;align-items:center}
|
||||
.like-button{width:62rpx;height:62rpx;display:flex;align-items:center;justify-content:center;border-radius:31rpx;background:#FFF0F5;box-shadow:0 6rpx 18rpx rgba(255,79,145,.16)}
|
||||
.like-button{width:var(--tap-min);min-height:var(--tap-min);display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);background:var(--color-primary-light);box-shadow:0 6rpx 18rpx rgba(255,79,145,.16);}
|
||||
.like-button image{width:42rpx;height:42rpx}
|
||||
.like-button.loading{opacity:.45}
|
||||
.list-end-hint{text-align:center;padding:24rpx;font-size:20rpx;color:#9A9EB0}
|
||||
.discover-empty{margin:70rpx 40rpx 0;padding:34rpx;display:flex;flex-direction:column;align-items:center;background:#fff;border-radius:28rpx;box-shadow:0 10rpx 32rpx rgba(34,35,91,.08)}
|
||||
.list-end-hint{text-align:center;padding:24rpx;font-size:24rpx;color:var(--color-text-tertiary)}
|
||||
.discover-empty{margin:70rpx 40rpx 0;padding:34rpx;display:flex;flex-direction:column;align-items:center;background:var(--color-bg-card);border-radius:28rpx;box-shadow:0 10rpx 32rpx rgba(34,35,91,.08)}
|
||||
.discover-empty image{width:112rpx;height:112rpx}
|
||||
.empty-title{margin-top:12rpx;font-size:28rpx;font-weight:650;color:#252A49}
|
||||
.empty-desc{margin-top:10rpx;text-align:center;font-size:21rpx;line-height:1.55;color:#858A9E}
|
||||
.empty-action{margin-top:24rpx;min-width:180rpx;height:64rpx;display:flex;align-items:center;justify-content:center;border-radius:32rpx;background:linear-gradient(135deg,var(--mini-accent-coral),var(--mini-accent-pink));color:#fff;font-size:23rpx;font-weight:650}
|
||||
.empty-title{margin-top:12rpx;font-size:28rpx;font-weight:600;color:var(--color-text-strong)}
|
||||
.empty-desc{margin-top:10rpx;text-align:center;font-size:24rpx;line-height:1.55;color:var(--color-text-tertiary)}
|
||||
.empty-action{margin-top:24rpx;min-width:180rpx;min-height:var(--tap-min);display:flex;align-items:center;justify-content:center;border-radius:32rpx;background:var(--gradient-brand-solid);color:var(--color-text-inverse);font-size:24rpx;font-weight:600}
|
||||
|
||||
@@ -1,119 +1,119 @@
|
||||
/* 我的缘分页 U22 — Design Tokens */
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #FFF8F7;
|
||||
min-height:100vh;
|
||||
background:var(--color-primary-lighter);
|
||||
}
|
||||
|
||||
/* Tab 切换栏(粘性吸附在自定义导航栏下方) */
|
||||
.tabs {
|
||||
display: flex;
|
||||
background: #fff;
|
||||
border-bottom: 1rpx solid #F0F0F0;
|
||||
position: sticky;
|
||||
z-index: 10;
|
||||
display:flex;
|
||||
background:var(--color-bg-card);
|
||||
border-bottom:1rpx solid var(--color-divider);
|
||||
position:sticky;
|
||||
z-index:10;
|
||||
}
|
||||
|
||||
.tab {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
padding: 28rpx 0;
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
position: relative;
|
||||
transition: color 0.2s;
|
||||
flex:1;
|
||||
text-align:center;
|
||||
padding:28rpx 0;
|
||||
font-size:28rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
position:relative;
|
||||
transition:color 0.2s;
|
||||
}
|
||||
|
||||
.tab.active {
|
||||
color: #E96B6B;
|
||||
font-weight: bold;
|
||||
color:var(--color-primary-strong);
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
.tab.active::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 48rpx;
|
||||
height: 4rpx;
|
||||
background: #E96B6B;
|
||||
border-radius: 2rpx;
|
||||
content:'';
|
||||
position:absolute;
|
||||
bottom:0;
|
||||
left:50%;
|
||||
transform:translateX(-50%);
|
||||
width:48rpx;
|
||||
height:4rpx;
|
||||
background:var(--color-primary);
|
||||
border-radius:2rpx;
|
||||
}
|
||||
|
||||
.tab-count {
|
||||
display: inline-block;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
font-size: 20rpx;
|
||||
padding: 2rpx 10rpx;
|
||||
border-radius: 20rpx;
|
||||
margin-left: 8rpx;
|
||||
vertical-align: middle;
|
||||
display:inline-block;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
font-size:20rpx;
|
||||
padding:2rpx 10rpx;
|
||||
border-radius:20rpx;
|
||||
margin-left:8rpx;
|
||||
vertical-align:middle;
|
||||
}
|
||||
|
||||
/* 列表容器 */
|
||||
.list-wrap {
|
||||
padding: 24rpx;
|
||||
box-sizing: border-box;
|
||||
padding:24rpx;
|
||||
box-sizing:border-box;
|
||||
}
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:16rpx;
|
||||
}
|
||||
|
||||
.item {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 24rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
padding:24rpx;
|
||||
box-shadow:0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
/* 操作按钮 */
|
||||
.btn-primary {
|
||||
flex-shrink: 0;
|
||||
height: 64rpx;
|
||||
line-height: 64rpx;
|
||||
padding: 0 28rpx;
|
||||
border-radius: 32rpx;
|
||||
font-size: 24rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
border: none;
|
||||
}
|
||||
flex-shrink:0;
|
||||
min-height:var(--tap-min);
|
||||
line-height:var(--tap-min);
|
||||
padding:0 28rpx;
|
||||
border-radius:32rpx;
|
||||
font-size:24rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
border:none;
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
.btn-primary::after {
|
||||
border: none;
|
||||
border:none;
|
||||
}
|
||||
|
||||
.btn-like-back {
|
||||
flex-shrink: 0;
|
||||
height: 64rpx;
|
||||
line-height: 64rpx;
|
||||
padding: 0 28rpx;
|
||||
border-radius: 32rpx;
|
||||
font-size: 24rpx;
|
||||
background: #FFF3F2;
|
||||
color: #E96B6B;
|
||||
border: 2rpx solid #E96B6B;
|
||||
}
|
||||
flex-shrink:0;
|
||||
min-height:var(--tap-min);
|
||||
line-height:var(--tap-min);
|
||||
padding:0 28rpx;
|
||||
border-radius:32rpx;
|
||||
font-size:24rpx;
|
||||
background:var(--color-primary-light);
|
||||
color:var(--color-primary-strong);
|
||||
border:2rpx solid var(--color-primary);
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
.btn-like-back::after {
|
||||
border: none;
|
||||
border:none;
|
||||
}
|
||||
|
||||
.btn-like-back.disabled {
|
||||
opacity: 0.5;
|
||||
opacity:0.5;
|
||||
}
|
||||
|
||||
/* 等待回应状态 */
|
||||
.status-waiting {
|
||||
flex-shrink: 0;
|
||||
font-size: 22rpx;
|
||||
color: #E96B6B;
|
||||
padding: 8rpx 16rpx;
|
||||
background: #FFF3F2;
|
||||
border-radius: 8rpx;
|
||||
white-space: nowrap;
|
||||
flex-shrink:0;
|
||||
font-size:24rpx;
|
||||
color:var(--color-primary-strong);
|
||||
padding:8rpx 16rpx;
|
||||
background:var(--color-primary-light);
|
||||
border-radius:8rpx;
|
||||
white-space:nowrap;
|
||||
}
|
||||
|
||||
@@ -1,70 +1,70 @@
|
||||
/* 帮助中心样式 */
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #f5f5f5;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-subtle);
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
}
|
||||
|
||||
.category-bar {
|
||||
white-space: nowrap;
|
||||
background: #fff;
|
||||
padding: 0 24rpx;
|
||||
border-bottom: 1rpx solid #f0f0f0;
|
||||
flex-shrink: 0;
|
||||
white-space:nowrap;
|
||||
background:var(--color-bg-card);
|
||||
padding:0 24rpx;
|
||||
border-bottom:1rpx solid var(--color-divider);
|
||||
flex-shrink:0;
|
||||
}
|
||||
|
||||
.category-item {
|
||||
display: inline-block;
|
||||
padding: 24rpx 32rpx;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
border-bottom: 4rpx solid transparent;
|
||||
display:inline-block;
|
||||
padding:24rpx 32rpx;
|
||||
font-size:28rpx;
|
||||
color:var(--color-text-secondary);
|
||||
border-bottom:4rpx solid transparent;
|
||||
}
|
||||
|
||||
.category-item.active {
|
||||
color: #E96B6B;
|
||||
border-bottom-color: #E96B6B;
|
||||
font-weight: 600;
|
||||
color:var(--color-primary-strong);
|
||||
border-bottom-color:var(--color-primary);
|
||||
font-weight:600;
|
||||
}
|
||||
|
||||
.faq-list {
|
||||
flex: 1;
|
||||
padding: 24rpx 32rpx;
|
||||
flex:1;
|
||||
padding:24rpx 32rpx;
|
||||
}
|
||||
|
||||
.faq-item {
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
margin-bottom: 24rpx;
|
||||
padding: 28rpx 32rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:16rpx;
|
||||
margin-bottom:24rpx;
|
||||
padding:28rpx 32rpx;
|
||||
}
|
||||
|
||||
.faq-question {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-size: 30rpx;
|
||||
color: #2d2d2d;
|
||||
font-weight: 500;
|
||||
display:flex;
|
||||
justify-content:space-between;
|
||||
align-items:center;
|
||||
font-size:30rpx;
|
||||
color:var(--color-text-strong);
|
||||
font-weight:500;
|
||||
}
|
||||
|
||||
.faq-arrow {
|
||||
font-size: 20rpx;
|
||||
color: #ccc;
|
||||
transition: transform 0.2s;
|
||||
font-size:20rpx;
|
||||
color:var(--color-text-disabled);
|
||||
transition:transform 0.2s;
|
||||
}
|
||||
|
||||
.faq-arrow.up {
|
||||
transform: rotate(180deg);
|
||||
color: #E96B6B;
|
||||
transform:rotate(180deg);
|
||||
color:var(--color-primary-strong);
|
||||
}
|
||||
|
||||
.faq-answer {
|
||||
margin-top: 20rpx;
|
||||
padding-top: 20rpx;
|
||||
border-top: 1rpx solid #f5f5f5;
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
line-height: 1.7;
|
||||
margin-top:20rpx;
|
||||
padding-top:20rpx;
|
||||
border-top:1rpx solid var(--color-divider);
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-secondary);
|
||||
line-height:1.7;
|
||||
}
|
||||
|
||||
+696
-10
@@ -1,10 +1,696 @@
|
||||
.page{min-height:100vh;background:#F4F5FA;padding-bottom:40rpx}.night-shell{padding:0 24rpx 28rpx;background:linear-gradient(160deg,var(--mini-night-start),var(--mini-night-end));border-radius:0 0 42rpx 42rpx;box-shadow:var(--mini-shadow)}
|
||||
.brand-bar{height:112rpx;padding-top:env(safe-area-inset-top);display:flex;align-items:center;justify-content:space-between;color:var(--mini-text-on-night)}.brand-lockup{display:flex;align-items:center}.brand-logo{width:66rpx;height:66rpx}.brand-copy{display:flex;flex-direction:column;margin-left:12rpx}.brand-name{font-size:34rpx;font-weight:700;letter-spacing:2rpx}.brand-slogan{font-size:18rpx;letter-spacing:4rpx;color:var(--mini-text-on-night-muted)}.brand-actions{position:relative;min-width:76rpx;height:72rpx;display:flex;align-items:center;justify-content:center}.message-label{font-size:23rpx}.badge{position:absolute;right:0;top:4rpx;min-width:28rpx;height:28rpx;padding:0 4rpx;line-height:28rpx;text-align:center;font-size:18rpx;color:#fff;background:var(--mini-accent-pink);border-radius:20rpx}
|
||||
.status-strip{margin:4rpx 0 16rpx;padding:18rpx 20rpx;border:1rpx solid rgba(255,255,255,.16);background:rgba(255,255,255,.09);border-radius:20rpx;color:#fff}.status-main{display:flex;align-items:center;gap:16rpx}.status-copy{flex:1;min-width:0;display:flex;flex-direction:column}.status-title{font-size:25rpx;font-weight:650}.status-desc{margin-top:5rpx;font-size:20rpx;color:var(--mini-text-on-night-muted);line-height:1.4}.status-action{flex:none;min-width:108rpx;min-height:56rpx;padding:0 18rpx;display:flex;align-items:center;justify-content:center;border-radius:28rpx;background:linear-gradient(135deg,var(--mini-accent-coral),var(--mini-accent-pink));font-size:22rpx;font-weight:650}.status-checks{display:flex;gap:10rpx;overflow:hidden}.status-check{padding:8rpx 12rpx;border-radius:20rpx;background:rgba(255,255,255,.08);font-size:19rpx;color:var(--mini-text-on-night-muted);white-space:nowrap}.status-check.done{background:rgba(90,226,184,.16);color:#A6F5D7}
|
||||
.banner-section{width:100%}.banner-swiper,.banner-card{height:272rpx;border-radius:26rpx;overflow:hidden}.banner-card{position:relative}.banner-img{width:100%;height:100%;display:block}.banner-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(25,22,86,.78) 0%,rgba(43,22,101,.25) 58%,rgba(255,79,145,.08) 100%)}.banner-copy{position:absolute;left:26rpx;bottom:26rpx;width:68%;display:flex;flex-direction:column;color:#fff}.banner-kicker{font-size:18rpx;letter-spacing:3rpx;color:rgba(255,255,255,.78)}.banner-title{margin-top:9rpx;font-size:35rpx;line-height:1.2;font-weight:750;text-shadow:0 3rpx 10rpx rgba(0,0,0,.2)}.banner-subtitle{margin-top:8rpx;font-size:22rpx;color:rgba(255,255,255,.84)}
|
||||
.entries-card{position:relative;z-index:2;margin:-14rpx 24rpx 0;padding:22rpx 10rpx 18rpx;background:var(--mini-card-bg);border-radius:30rpx;box-shadow:var(--mini-shadow)}.entries-grid{display:grid;grid-template-columns:repeat(4,1fr);row-gap:18rpx}.entry-item{min-height:104rpx;display:flex;flex-direction:column;align-items:center;justify-content:center}.entry-item.disabled{opacity:.4}.entry-icon{width:66rpx;height:66rpx;display:flex;align-items:center;justify-content:center;border-radius:20rpx;overflow:hidden}.entry-icon-image{width:45rpx;height:45rpx}.entry-label{margin-top:8rpx;font-size:21rpx;color:#283056;font-weight:550}.tone-rose{background:#FFF0F5}.tone-purple{background:#F0EAFE}.tone-blue{background:#EAF3FF}.tone-pink{background:#FFF0F7}.tone-amber{background:#FFF3E5}.tone-indigo{background:#ECEEFF}.tone-red{background:#FFEDEF}.tone-green{background:#EAF8F2}
|
||||
.preview-note{margin:16rpx 24rpx 0;text-align:center;color:#8B63BC;font-size:20rpx}.section{margin-top:34rpx;padding:0 24rpx}.recommendation-section{margin-top:30rpx}.recommend-list{margin-top:16rpx;border-radius:26rpx;overflow:hidden;box-shadow:0 8rpx 28rpx rgba(35,35,95,.07)}.recommend-empty{margin-top:16rpx;padding:22rpx;display:flex;align-items:center;gap:18rpx;background:#fff;border-radius:26rpx;box-shadow:0 8rpx 28rpx rgba(35,35,95,.07)}.empty-logo{width:76rpx;height:76rpx;flex:none}.empty-copy{flex:1;min-width:0;display:flex;flex-direction:column}.empty-title{font-size:25rpx;font-weight:650;color:#222746}.empty-desc{margin-top:6rpx;font-size:20rpx;line-height:1.4;color:#7A7F98}.empty-actions{display:flex;flex-direction:column;gap:8rpx}.empty-btn{min-width:112rpx;height:48rpx;padding:0 12rpx;display:flex;align-items:center;justify-content:center;border-radius:24rpx;font-size:20rpx}.empty-btn.secondary{color:#7C60BC;background:#F1EEFB}.empty-btn.primary{color:#fff;background:linear-gradient(135deg,var(--mini-accent-coral),var(--mini-accent-pink))}
|
||||
.service-card{display:flex;align-items:stretch;margin-top:16rpx;background:#fff;border-radius:26rpx;overflow:hidden;box-shadow:0 8rpx 28rpx rgba(35,35,95,.07)}.service-cover{width:210rpx;min-height:156rpx}.service-copy{flex:1;padding:20rpx;display:flex;flex-direction:column}.service-title{font-size:25rpx;font-weight:650;color:#222746}.service-desc{margin-top:7rpx;font-size:21rpx;color:#757B91;line-height:1.45}.text-link{margin-top:auto;padding-top:10rpx;font-size:21rpx;color:var(--mini-accent-pink);font-weight:650}
|
||||
.activity-scroll{white-space:nowrap;margin-top:16rpx}.activity-card{display:inline-flex;width:550rpx;margin-right:18rpx;background:#fff;border-radius:24rpx;overflow:hidden;box-shadow:0 8rpx 28rpx rgba(35,35,95,.07);white-space:normal}.activity-cover{width:210rpx;height:168rpx}.activity-info{flex:1;padding:18rpx;display:flex;flex-direction:column}.activity-tag{align-self:flex-start;padding:5rpx 12rpx;border-radius:18rpx;background:#FFF0F5;color:var(--mini-accent-pink);font-size:18rpx}.activity-title{margin-top:10rpx;font-size:25rpx;font-weight:650;color:#222746;line-height:1.35}.activity-meta{margin-top:auto;font-size:20rpx;color:#81869B}
|
||||
.station-card,.article-row,.safety-card{display:flex;align-items:center;background:#fff;border-radius:26rpx;overflow:hidden;box-shadow:0 8rpx 28rpx rgba(35,35,95,.07)}.station-cover{width:190rpx;height:170rpx}.station-info{flex:1;min-width:0;padding:18rpx}.station-name{display:block;font-size:26rpx;font-weight:650;color:#222746}.station-desc{display:block;margin:7rpx 0 12rpx;font-size:20rpx;color:#7A7F98}.mini-tag{display:inline-block;margin:4rpx 7rpx 0 0;padding:4rpx 9rpx;border-radius:14rpx;background:#F0EEFB;color:#6857A2;font-size:17rpx}.arrow-icon{width:28rpx;height:28rpx;margin:16rpx;flex:none}.article-list{margin-top:16rpx;display:flex;flex-direction:column;gap:12rpx}.article-row{min-height:112rpx}.article-cover{width:146rpx;height:112rpx}.article-info,.safety-info{flex:1;min-width:0;padding:16rpx}.article-title{display:block;font-size:24rpx;font-weight:600;color:#222746;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.article-meta{display:block;margin-top:6rpx;font-size:19rpx;color:#85899C}.section-empty{margin-top:16rpx;padding:30rpx 24rpx;text-align:center;color:#8A90A6;font-size:22rpx;background:#fff;border-radius:24rpx;box-shadow:0 8rpx 28rpx rgba(35,35,95,.05)}.safety-card{padding:0}.safety-cover{width:180rpx;align-self:stretch}.safety-title{display:block;font-size:25rpx;font-weight:650;color:#222746}.safety-body{display:block;margin-top:7rpx;font-size:20rpx;line-height:1.45;color:#74798E}.safety-link{display:block;margin-top:9rpx;font-size:20rpx;color:var(--mini-accent-pink);font-weight:650}
|
||||
@media (max-width:340px){.entry-label{font-size:19rpx}.entry-icon{width:60rpx;height:60rpx}.banner-title{font-size:31rpx}.status-checks{overflow-x:auto}.empty-actions{display:none}}
|
||||
/**
|
||||
* 首页 —— 全站设计系统样板页
|
||||
*
|
||||
* 2026-09-22 重做。这一版要证明 app.wxss v2 的底座是"能用"的:
|
||||
*
|
||||
* 1) 氛围层(参考图的关键差异项)
|
||||
* 旧版只有一条线性渐变,参考图里有明显的暖粉光晕、星点与玻璃质感。
|
||||
* 现用三层叠加:--mini-starfield(星点)+ --gradient-night(夜空)
|
||||
* + 两个定位光晕伪元素(左上粉 / 左下靛蓝),零图片、零额外请求。
|
||||
*
|
||||
* 2) 排版层级
|
||||
* 旧版 hero 标题 35rpx、区块标题 36rpx、卡片标题 25rpx、正文 24rpx ——
|
||||
* hero 与区块标题几乎同号,层级读不出来。现为:
|
||||
* hero 48rpx/700 > 区块标题 40rpx/600 > 卡片标题 28rpx/600 >
|
||||
* 正文 26rpx > 元信息 24rpx
|
||||
*
|
||||
* 3) 触摸目标
|
||||
* 所有可点元素以 --tap-min(88rpx=44px) 为下限;旧版 .empty-btn 只有 24px。
|
||||
* 并且删掉了 @media(max-width:340px) 里的 .empty-actions{display:none} ——
|
||||
* 那等于在小屏上把「调整条件 / 公益红娘」两个入口整块砍掉。
|
||||
*
|
||||
* 4) 交互反馈
|
||||
* 旧版全站 --motion-* 只被引用 5 次,点了没反应。现统一走 --ease-spring
|
||||
* + --press-scale,并给区块卡片加上按压缩放。
|
||||
*
|
||||
* 5) 对比度
|
||||
* 旧版 .text-link/.activity-tag/.safety-link 用 --mini-accent-pink(#FF4F91)
|
||||
* 作文字 = 3.10:1,不达标;CTA 白字压在珊瑚粉渐变上也只有 2.77:1。
|
||||
* 现分别改用 --color-primary-strong(5.33:1) 与 --gradient-brand-solid(≥4.7:1)。
|
||||
*
|
||||
* 单位:rpx(750rpx = 屏幕宽度,1rpx ≈ 0.5px)
|
||||
*/
|
||||
|
||||
/* ============================== 页面骨架 ============================== */
|
||||
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: var(--color-bg-page);
|
||||
padding-bottom: var(--spacing-5);
|
||||
}
|
||||
|
||||
/* ============================== 夜空头部 ============================== */
|
||||
|
||||
.night-shell {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding: 0 var(--spacing-3) var(--spacing-4);
|
||||
background: var(--mini-starfield), var(--gradient-night);
|
||||
border-radius: 0 0 var(--radius-2xl) var(--radius-2xl);
|
||||
box-shadow: var(--shadow-night);
|
||||
}
|
||||
|
||||
/* 两个光晕:伪元素承担,避免为了装饰再嵌一层 view */
|
||||
.night-shell::before,
|
||||
.night-shell::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
border-radius: 50%;
|
||||
pointer-events: none;
|
||||
z-index: var(--z-ambient);
|
||||
}
|
||||
.night-shell::before {
|
||||
top: -200rpx;
|
||||
right: -140rpx;
|
||||
width: 560rpx;
|
||||
height: 560rpx;
|
||||
background: radial-gradient(circle, var(--mini-glow-coral) 0%, transparent 68%);
|
||||
}
|
||||
.night-shell::after {
|
||||
bottom: -220rpx;
|
||||
left: -160rpx;
|
||||
width: 620rpx;
|
||||
height: 620rpx;
|
||||
background: radial-gradient(circle, var(--mini-glow-indigo) 0%, transparent 70%);
|
||||
}
|
||||
|
||||
/* 伪元素是定位元素,会盖住静态流内容;正文需要显式抬一层 */
|
||||
.night-shell > view {
|
||||
position: relative;
|
||||
z-index: var(--z-base);
|
||||
}
|
||||
|
||||
/* ============================== 品牌栏 ============================== */
|
||||
|
||||
.brand-bar {
|
||||
min-height: 112rpx;
|
||||
padding-top: env(safe-area-inset-top);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
color: var(--mini-text-on-night);
|
||||
}
|
||||
.brand-lockup {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-width: 0;
|
||||
}
|
||||
.brand-logo {
|
||||
width: 68rpx;
|
||||
height: 68rpx;
|
||||
flex: none;
|
||||
}
|
||||
.brand-copy {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-left: var(--spacing-2);
|
||||
}
|
||||
.brand-name {
|
||||
font-size: var(--font-size-lg);
|
||||
font-weight: var(--font-weight-bold);
|
||||
letter-spacing: var(--letter-spacing-wider);
|
||||
line-height: var(--line-height-tight);
|
||||
}
|
||||
.brand-slogan {
|
||||
margin-top: 2rpx;
|
||||
font-size: var(--font-size-xs);
|
||||
letter-spacing: 3rpx;
|
||||
color: var(--mini-text-on-night-muted);
|
||||
}
|
||||
.brand-actions {
|
||||
position: relative;
|
||||
flex: none;
|
||||
min-width: var(--tap-min);
|
||||
min-height: var(--tap-min);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.message-label {
|
||||
font-size: var(--font-size-sm);
|
||||
}
|
||||
.badge {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 4rpx;
|
||||
min-width: 30rpx;
|
||||
height: 30rpx;
|
||||
padding: 0 5rpx;
|
||||
line-height: 30rpx;
|
||||
text-align: center;
|
||||
font-size: var(--font-size-micro);
|
||||
color: var(--color-text-inverse);
|
||||
/* 白字需 4.5:1:--mini-accent-pink 仅 3.10,改用 solid 变体 */
|
||||
background: var(--color-primary-solid);
|
||||
border-radius: var(--radius-full);
|
||||
/* 描一圈夜空底色,避免角标压在光晕上时边缘糊掉 */
|
||||
box-shadow: 0 0 0 3rpx var(--mini-night-start);
|
||||
}
|
||||
|
||||
/* ============================== 状态条 ============================== */
|
||||
|
||||
.status-strip {
|
||||
margin: var(--spacing-1) 0 var(--spacing-2);
|
||||
padding: var(--spacing-3);
|
||||
border: var(--border-width) solid var(--mini-hairline);
|
||||
background: var(--mini-glass);
|
||||
border-radius: var(--radius-md);
|
||||
color: var(--color-text-inverse);
|
||||
}
|
||||
.status-main {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--spacing-2);
|
||||
}
|
||||
.status-copy {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.status-title {
|
||||
font-size: var(--font-size-md);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
line-height: var(--line-height-tight);
|
||||
}
|
||||
.status-desc {
|
||||
margin-top: 6rpx;
|
||||
font-size: var(--font-size-xs);
|
||||
line-height: var(--line-height-normal);
|
||||
color: var(--mini-text-on-night-muted);
|
||||
}
|
||||
.status-action {
|
||||
flex: none;
|
||||
min-width: 116rpx;
|
||||
min-height: var(--tap-min);
|
||||
padding: 0 var(--spacing-3);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: var(--radius-full);
|
||||
background: var(--gradient-brand-solid);
|
||||
font-size: var(--font-size-sm);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
}
|
||||
.status-checks {
|
||||
display: flex;
|
||||
gap: 10rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
.status-check {
|
||||
padding: 8rpx 14rpx;
|
||||
border-radius: var(--radius-full);
|
||||
background: var(--mini-glass);
|
||||
font-size: var(--font-size-xs);
|
||||
color: var(--mini-text-on-night-muted);
|
||||
white-space: nowrap;
|
||||
}
|
||||
.status-check.done {
|
||||
background: var(--mini-glass-success);
|
||||
color: var(--color-success-on-night);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
}
|
||||
|
||||
/* ============================== 主视觉横幅 ============================== */
|
||||
|
||||
.banner-section {
|
||||
width: 100%;
|
||||
}
|
||||
.banner-swiper,
|
||||
.banner-card {
|
||||
height: 300rpx;
|
||||
border-radius: var(--radius-lg);
|
||||
overflow: hidden;
|
||||
}
|
||||
.banner-card {
|
||||
position: relative;
|
||||
}
|
||||
.banner-img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
.banner-overlay {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: var(--mini-banner-scrim);
|
||||
}
|
||||
.banner-copy {
|
||||
position: absolute;
|
||||
left: var(--spacing-3);
|
||||
bottom: var(--spacing-5);
|
||||
width: 68%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
color: var(--color-text-inverse);
|
||||
}
|
||||
.banner-kicker {
|
||||
font-size: var(--font-size-xs);
|
||||
letter-spacing: 3rpx;
|
||||
color: var(--mini-text-on-night-muted);
|
||||
}
|
||||
.banner-title {
|
||||
margin-top: 10rpx;
|
||||
font-size: var(--font-size-2xl);
|
||||
line-height: var(--line-height-tight);
|
||||
font-weight: var(--font-weight-bold);
|
||||
letter-spacing: var(--letter-spacing-wide);
|
||||
text-shadow: 0 4rpx 14rpx rgba(0, 0, 0, 0.22);
|
||||
}
|
||||
.banner-subtitle {
|
||||
margin-top: 10rpx;
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--mini-text-on-night-muted);
|
||||
}
|
||||
|
||||
/* ============================== 快捷入口 ============================== */
|
||||
|
||||
.entries-card {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
margin: -18rpx var(--spacing-3) 0;
|
||||
padding: var(--spacing-3) var(--spacing-1) var(--spacing-2);
|
||||
background: var(--mini-card-bg);
|
||||
border-radius: var(--radius-lg);
|
||||
box-shadow: var(--shadow-raised);
|
||||
}
|
||||
/* 4 列宫格用 flex + 25% 宽实现。display:grid 在 Skyline 渲染引擎下不支持,
|
||||
统一避开以免将来切渲染引擎时整体错版。 */
|
||||
.entries-grid {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
row-gap: var(--spacing-2);
|
||||
}
|
||||
.entry-item {
|
||||
width: 25%;
|
||||
box-sizing: border-box;
|
||||
min-height: 116rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.entry-item.disabled {
|
||||
opacity: 0.4;
|
||||
}
|
||||
.entry-icon {
|
||||
width: 72rpx;
|
||||
height: 72rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: var(--radius-md);
|
||||
overflow: hidden;
|
||||
}
|
||||
.entry-icon-image {
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
}
|
||||
.entry-label {
|
||||
margin-top: var(--spacing-1);
|
||||
font-size: var(--font-size-sm);
|
||||
font-weight: var(--font-weight-medium);
|
||||
color: var(--color-text-strong);
|
||||
}
|
||||
|
||||
.tone-rose { background: var(--color-primary-light); }
|
||||
.tone-purple { background: var(--color-accent-purple-light); }
|
||||
.tone-blue { background: var(--color-info-light); }
|
||||
.tone-pink { background: var(--color-primary-light); }
|
||||
.tone-amber { background: var(--color-warning-light); }
|
||||
.tone-indigo { background: var(--color-info-light); }
|
||||
.tone-red { background: var(--color-danger-light); }
|
||||
.tone-green { background: var(--color-success-light); }
|
||||
|
||||
/* ============================== 区块容器 ============================== */
|
||||
|
||||
.preview-note {
|
||||
margin: var(--spacing-2) var(--spacing-3) 0;
|
||||
text-align: center;
|
||||
font-size: var(--font-size-xs);
|
||||
color: var(--color-accent-purple-strong);
|
||||
}
|
||||
.section {
|
||||
margin-top: var(--spacing-5);
|
||||
padding: 0 var(--spacing-3);
|
||||
}
|
||||
.recommendation-section {
|
||||
margin-top: var(--spacing-5);
|
||||
}
|
||||
/* 标题与卡片左边缘必须对齐:.section 已提供 24rpx 内边距,
|
||||
而 ui-section 自带 --spacing-page-x(32rpx),叠加会让标题比卡片多缩进 32rpx。 */
|
||||
.section .ui-section {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
/* ============================== 今日推荐 ============================== */
|
||||
|
||||
.recommend-list {
|
||||
margin-top: var(--spacing-2);
|
||||
border-radius: var(--radius-lg);
|
||||
overflow: hidden;
|
||||
box-shadow: var(--shadow-card);
|
||||
}
|
||||
.recommend-empty {
|
||||
margin-top: var(--spacing-2);
|
||||
padding: var(--spacing-3);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--spacing-2);
|
||||
background: var(--color-bg-card);
|
||||
border-radius: var(--radius-lg);
|
||||
box-shadow: var(--shadow-card);
|
||||
}
|
||||
.empty-logo {
|
||||
width: 76rpx;
|
||||
height: 76rpx;
|
||||
flex: none;
|
||||
}
|
||||
.empty-copy {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.empty-title {
|
||||
font-size: var(--font-size-md);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
color: var(--color-text-strong);
|
||||
}
|
||||
.empty-desc {
|
||||
margin-top: 6rpx;
|
||||
font-size: var(--font-size-sm);
|
||||
line-height: var(--line-height-normal);
|
||||
color: var(--color-text-tertiary);
|
||||
}
|
||||
.empty-actions {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--spacing-1);
|
||||
}
|
||||
.empty-btn {
|
||||
min-width: 120rpx;
|
||||
min-height: var(--tap-min);
|
||||
padding: 0 var(--spacing-2);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: var(--radius-full);
|
||||
font-size: var(--font-size-sm);
|
||||
font-weight: var(--font-weight-medium);
|
||||
}
|
||||
.empty-btn.secondary {
|
||||
color: var(--color-accent-purple-strong);
|
||||
background: var(--color-accent-purple-light);
|
||||
}
|
||||
.empty-btn.primary {
|
||||
color: var(--color-text-inverse);
|
||||
background: var(--gradient-brand-solid);
|
||||
}
|
||||
|
||||
/* ============================== 公益服务 ============================== */
|
||||
|
||||
.service-card {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
margin-top: var(--spacing-2);
|
||||
background: var(--color-bg-card);
|
||||
border-radius: var(--radius-lg);
|
||||
overflow: hidden;
|
||||
box-shadow: var(--shadow-card);
|
||||
}
|
||||
.service-cover {
|
||||
width: 210rpx;
|
||||
min-height: 160rpx;
|
||||
flex: none;
|
||||
}
|
||||
.service-copy {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
padding: var(--spacing-3);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.service-title {
|
||||
font-size: var(--font-size-md);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
color: var(--color-text-strong);
|
||||
}
|
||||
.service-desc {
|
||||
margin-top: 8rpx;
|
||||
font-size: var(--font-size-sm);
|
||||
line-height: var(--line-height-normal);
|
||||
color: var(--color-text-tertiary);
|
||||
}
|
||||
.text-link {
|
||||
margin-top: auto;
|
||||
padding-top: var(--spacing-1);
|
||||
font-size: var(--font-size-sm);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
color: var(--color-primary-strong);
|
||||
}
|
||||
|
||||
/* ============================== 近期活动 ============================== */
|
||||
|
||||
.activity-scroll {
|
||||
white-space: nowrap;
|
||||
margin-top: var(--spacing-2);
|
||||
}
|
||||
.activity-card {
|
||||
display: inline-flex;
|
||||
width: 550rpx;
|
||||
margin-right: var(--spacing-2);
|
||||
background: var(--color-bg-card);
|
||||
border-radius: var(--radius-md);
|
||||
overflow: hidden;
|
||||
box-shadow: var(--shadow-card);
|
||||
white-space: normal;
|
||||
}
|
||||
.activity-cover {
|
||||
width: 210rpx;
|
||||
height: 172rpx;
|
||||
flex: none;
|
||||
}
|
||||
.activity-info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
padding: var(--spacing-2);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.activity-tag {
|
||||
align-self: flex-start;
|
||||
padding: 5rpx 14rpx;
|
||||
border-radius: var(--radius-full);
|
||||
background: var(--color-primary-light);
|
||||
color: var(--color-primary-strong);
|
||||
font-size: var(--font-size-xs);
|
||||
font-weight: var(--font-weight-medium);
|
||||
}
|
||||
.activity-title {
|
||||
margin-top: 10rpx;
|
||||
font-size: var(--font-size-md);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
line-height: var(--line-height-tight);
|
||||
color: var(--color-text-strong);
|
||||
}
|
||||
.activity-meta {
|
||||
margin-top: auto;
|
||||
font-size: var(--font-size-xs);
|
||||
color: var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
/* ============================== 服务站 / 婚恋课堂 ============================== */
|
||||
|
||||
.station-card,
|
||||
.article-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: var(--color-bg-card);
|
||||
border-radius: var(--radius-lg);
|
||||
overflow: hidden;
|
||||
box-shadow: var(--shadow-card);
|
||||
}
|
||||
.station-cover {
|
||||
width: 190rpx;
|
||||
height: 172rpx;
|
||||
flex: none;
|
||||
}
|
||||
.station-info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
padding: var(--spacing-2);
|
||||
}
|
||||
.station-name {
|
||||
display: block;
|
||||
font-size: var(--font-size-md);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
color: var(--color-text-strong);
|
||||
}
|
||||
.station-desc {
|
||||
display: block;
|
||||
margin: 8rpx 0 12rpx;
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-tertiary);
|
||||
}
|
||||
.mini-tag {
|
||||
display: inline-block;
|
||||
margin: 4rpx 8rpx 0 0;
|
||||
padding: 4rpx 12rpx;
|
||||
border-radius: var(--radius-sm);
|
||||
background: var(--color-accent-purple-light);
|
||||
color: var(--color-accent-purple-strong);
|
||||
font-size: var(--font-size-xs);
|
||||
}
|
||||
.arrow-icon {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
margin: var(--spacing-2);
|
||||
flex: none;
|
||||
}
|
||||
.article-list {
|
||||
margin-top: var(--spacing-2);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12rpx;
|
||||
}
|
||||
.article-row {
|
||||
min-height: 116rpx;
|
||||
}
|
||||
.article-cover {
|
||||
width: 146rpx;
|
||||
height: 116rpx;
|
||||
flex: none;
|
||||
}
|
||||
.article-info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
padding: var(--spacing-2);
|
||||
}
|
||||
.article-title {
|
||||
display: block;
|
||||
font-size: var(--font-size-md);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
color: var(--color-text-strong);
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.article-meta {
|
||||
display: block;
|
||||
margin-top: 6rpx;
|
||||
font-size: var(--font-size-xs);
|
||||
color: var(--color-text-tertiary);
|
||||
}
|
||||
.section-empty {
|
||||
margin-top: var(--spacing-2);
|
||||
padding: var(--spacing-4) var(--spacing-3);
|
||||
text-align: center;
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-tertiary);
|
||||
background: var(--color-bg-card);
|
||||
border-radius: var(--radius-md);
|
||||
box-shadow: var(--shadow-card);
|
||||
}
|
||||
|
||||
/* ============================== 安全提醒 ============================== */
|
||||
|
||||
/* 注意:旧版这里写了 padding:0,把 .section 的左右 24rpx 内边距覆盖掉了,
|
||||
于是这张卡比其它区块宽出 48rpx、直接贴到屏幕边缘。现已移除。 */
|
||||
.safety-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: var(--color-bg-card);
|
||||
border-radius: var(--radius-lg);
|
||||
overflow: hidden;
|
||||
box-shadow: var(--shadow-card);
|
||||
}
|
||||
.safety-cover {
|
||||
width: 180rpx;
|
||||
align-self: stretch;
|
||||
flex: none;
|
||||
}
|
||||
.safety-info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
padding: var(--spacing-2);
|
||||
}
|
||||
.safety-title {
|
||||
display: block;
|
||||
font-size: var(--font-size-md);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
color: var(--color-text-strong);
|
||||
}
|
||||
.safety-body {
|
||||
display: block;
|
||||
margin-top: 8rpx;
|
||||
font-size: var(--font-size-sm);
|
||||
line-height: var(--line-height-normal);
|
||||
color: var(--color-text-tertiary);
|
||||
}
|
||||
.safety-link {
|
||||
display: block;
|
||||
margin-top: 10rpx;
|
||||
font-size: var(--font-size-sm);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
color: var(--color-primary-strong);
|
||||
}
|
||||
|
||||
/* ============================== 按压反馈 ==============================
|
||||
全站约定:可点元素必须有即时反馈(旧版 --motion-* 全站只被引用 5 次)。
|
||||
统一走 --ease-spring 的轻微回弹 + --press-scale,避免"点了没反应"。 */
|
||||
|
||||
.entry-item,
|
||||
.status-action,
|
||||
.empty-btn,
|
||||
.brand-actions,
|
||||
.service-card,
|
||||
.activity-card,
|
||||
.station-card,
|
||||
.article-row,
|
||||
.safety-card,
|
||||
.section-empty,
|
||||
.banner-card {
|
||||
transition: transform var(--motion-fast) var(--ease-spring),
|
||||
opacity var(--motion-fast) var(--ease-standard);
|
||||
}
|
||||
.entry-item:active,
|
||||
.status-action:active,
|
||||
.empty-btn:active,
|
||||
.brand-actions:active,
|
||||
.service-card:active,
|
||||
.activity-card:active,
|
||||
.station-card:active,
|
||||
.article-row:active,
|
||||
.safety-card:active,
|
||||
.section-empty:active,
|
||||
.banner-card:active {
|
||||
transform: scale(var(--press-scale));
|
||||
opacity: var(--press-opacity);
|
||||
}
|
||||
|
||||
/* ============================== 小屏适配 ==============================
|
||||
旧版在这里写了 .empty-actions{display:none}:小于 340px 的机型上
|
||||
「调整条件 / 公益红娘」两个入口会整块消失,属于功能级缺陷,已删除。
|
||||
收紧的是尺寸,不是功能。 */
|
||||
|
||||
@media (max-width: 340px) {
|
||||
.entry-label {
|
||||
font-size: var(--font-size-micro);
|
||||
}
|
||||
.entry-icon {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
.banner-title {
|
||||
font-size: var(--font-size-xl);
|
||||
}
|
||||
.status-checks {
|
||||
overflow-x: auto;
|
||||
}
|
||||
.empty-btn {
|
||||
min-width: 108rpx;
|
||||
padding: 0 var(--spacing-1);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,200 +1,200 @@
|
||||
/* U63 本地资格补充核验页 */
|
||||
.page {
|
||||
padding: 24rpx;
|
||||
background: #FAFAF8;
|
||||
min-height: 100vh;
|
||||
padding-bottom: 120rpx;
|
||||
padding:24rpx;
|
||||
background:var(--color-bg-page);
|
||||
min-height:100vh;
|
||||
padding-bottom:120rpx;
|
||||
}
|
||||
|
||||
.header {
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
padding: 32rpx 24rpx;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:16rpx;
|
||||
padding:32rpx 24rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
display: block;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #1a1a1a;
|
||||
margin-bottom: 12rpx;
|
||||
display:block;
|
||||
font-size:32rpx;
|
||||
font-weight:600;
|
||||
color:var(--color-text-strong);
|
||||
margin-bottom:12rpx;
|
||||
}
|
||||
|
||||
.desc {
|
||||
display: block;
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
line-height: 1.6;
|
||||
display:block;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-secondary);
|
||||
line-height:1.6;
|
||||
}
|
||||
|
||||
.type-tag {
|
||||
background: #E8F5E9;
|
||||
border-radius: 8rpx;
|
||||
padding: 16rpx 20rpx;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-success-light);
|
||||
border-radius:8rpx;
|
||||
padding:16rpx 20rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.type-tag text {
|
||||
font-size: 24rpx;
|
||||
color: #2E7D32;
|
||||
font-size:24rpx;
|
||||
color:var(--color-success-strong);
|
||||
}
|
||||
|
||||
.section {
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
padding: 24rpx;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:16rpx;
|
||||
padding:24rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
color: #1a1a1a;
|
||||
margin-bottom: 20rpx;
|
||||
display: block;
|
||||
font-size:28rpx;
|
||||
font-weight:600;
|
||||
color:var(--color-text-strong);
|
||||
margin-bottom:20rpx;
|
||||
display:block;
|
||||
}
|
||||
|
||||
.evidence-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:12rpx;
|
||||
}
|
||||
|
||||
.evidence-card {
|
||||
padding: 24rpx;
|
||||
border-radius: 12rpx;
|
||||
border: 2rpx solid #eee;
|
||||
padding:24rpx;
|
||||
border-radius:12rpx;
|
||||
border:2rpx solid var(--color-border);
|
||||
}
|
||||
|
||||
.evidence-card.active {
|
||||
border-color: #E96B6B;
|
||||
background: #FFF5F5;
|
||||
border-color:var(--color-primary);
|
||||
background:var(--color-primary-light);
|
||||
}
|
||||
|
||||
.evidence-label {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
margin-bottom: 4rpx;
|
||||
display:block;
|
||||
font-size:28rpx;
|
||||
font-weight:500;
|
||||
color:var(--color-text-primary);
|
||||
margin-bottom:4rpx;
|
||||
}
|
||||
|
||||
.evidence-desc {
|
||||
display: block;
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
display:block;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.upload-area {
|
||||
border: 2rpx dashed #ddd;
|
||||
border-radius: 12rpx;
|
||||
padding: 24rpx;
|
||||
border:2rpx dashed var(--color-border-strong);
|
||||
border-radius:12rpx;
|
||||
padding:24rpx;
|
||||
}
|
||||
|
||||
.upload-hint {
|
||||
text-align: center;
|
||||
margin-bottom: 16rpx;
|
||||
text-align:center;
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.hint-text {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.image-grid {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 16rpx;
|
||||
display:flex;
|
||||
flex-wrap:wrap;
|
||||
gap:16rpx;
|
||||
}
|
||||
|
||||
.image-item {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
position: relative;
|
||||
border-radius: 8rpx;
|
||||
overflow: hidden;
|
||||
width:160rpx;
|
||||
height:160rpx;
|
||||
position:relative;
|
||||
border-radius:8rpx;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.image-preview {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
width:100%;
|
||||
height:100%;
|
||||
object-fit:cover;
|
||||
}
|
||||
|
||||
.image-remove {
|
||||
position: absolute;
|
||||
top: 4rpx;
|
||||
right: 4rpx;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
background: rgba(0,0,0,0.5);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
font-size: 24rpx;
|
||||
line-height: 1;
|
||||
position:absolute;
|
||||
top:4rpx;
|
||||
right:4rpx;
|
||||
width:36rpx;
|
||||
height:36rpx;
|
||||
background:rgba(0,0,0,0.5);
|
||||
border-radius:50%;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
color:var(--color-text-inverse);
|
||||
font-size:24rpx;
|
||||
line-height:1;
|
||||
}
|
||||
|
||||
.upload-btn {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border: 2rpx dashed #ccc;
|
||||
border-radius: 8rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width:160rpx;
|
||||
height:160rpx;
|
||||
border:2rpx dashed var(--color-border-strong);
|
||||
border-radius:8rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
}
|
||||
|
||||
.upload-icon {
|
||||
font-size: 48rpx;
|
||||
color: #ccc;
|
||||
font-size:48rpx;
|
||||
color:var(--color-text-disabled);
|
||||
}
|
||||
|
||||
.upload-text {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
margin-top: 8rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
margin-top:8rpx;
|
||||
}
|
||||
|
||||
.privacy-note {
|
||||
background: #F0F7FF;
|
||||
border-radius: 8rpx;
|
||||
padding: 16rpx 20rpx;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-info-light);
|
||||
border-radius:8rpx;
|
||||
padding:16rpx 20rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.note-text {
|
||||
font-size: 24rpx;
|
||||
color: #1976D2;
|
||||
font-size:24rpx;
|
||||
color:var(--color-info-strong);
|
||||
}
|
||||
|
||||
.action-bar {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: 16rpx 24rpx;
|
||||
background: #fff;
|
||||
box-shadow: 0 -2rpx 12rpx rgba(0,0,0,0.05);
|
||||
padding-bottom: calc(16rpx + env(safe-area-inset-bottom));
|
||||
position:fixed;
|
||||
bottom:0;
|
||||
left:0;
|
||||
right:0;
|
||||
padding:16rpx 24rpx;
|
||||
background:var(--color-bg-card);
|
||||
box-shadow:0 -2rpx 12rpx rgba(0,0,0,0.05);
|
||||
padding-bottom:calc(16rpx + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
border-radius: 12rpx;
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
border: none;
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
border-radius:12rpx;
|
||||
font-size:30rpx;
|
||||
font-weight:500;
|
||||
border:none;
|
||||
}
|
||||
|
||||
.btn-primary:disabled {
|
||||
background: #ccc;
|
||||
background:var(--color-bg-muted);
|
||||
}
|
||||
|
||||
@@ -1,105 +1,105 @@
|
||||
/* U62 本地资格说明页 */
|
||||
.page {
|
||||
padding: 24rpx;
|
||||
background: #FAFAF8;
|
||||
min-height: 100vh;
|
||||
padding:24rpx;
|
||||
background:var(--color-bg-page);
|
||||
min-height:100vh;
|
||||
}
|
||||
|
||||
.header {
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
padding: 32rpx 24rpx;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:16rpx;
|
||||
padding:32rpx 24rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
display: block;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #1a1a1a;
|
||||
margin-bottom: 16rpx;
|
||||
display:block;
|
||||
font-size:32rpx;
|
||||
font-weight:600;
|
||||
color:var(--color-text-strong);
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.desc {
|
||||
display: block;
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
line-height: 1.6;
|
||||
display:block;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-secondary);
|
||||
line-height:1.6;
|
||||
}
|
||||
|
||||
.section {
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
padding: 24rpx;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:16rpx;
|
||||
padding:24rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
color: #1a1a1a;
|
||||
margin-bottom: 20rpx;
|
||||
display: block;
|
||||
font-size:28rpx;
|
||||
font-weight:600;
|
||||
color:var(--color-text-strong);
|
||||
margin-bottom:20rpx;
|
||||
display:block;
|
||||
}
|
||||
|
||||
.type-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 16rpx;
|
||||
display:flex;
|
||||
flex-wrap:wrap;
|
||||
gap:16rpx;
|
||||
}
|
||||
|
||||
.type-card {
|
||||
width: calc(50% - 8rpx);
|
||||
background: #F7F8FA;
|
||||
border-radius: 12rpx;
|
||||
padding: 28rpx 16rpx;
|
||||
text-align: center;
|
||||
border: 2rpx solid transparent;
|
||||
width:calc(50% - 8rpx);
|
||||
background:var(--color-bg-subtle);
|
||||
border-radius:12rpx;
|
||||
padding:28rpx 16rpx;
|
||||
text-align:center;
|
||||
border:2rpx solid transparent;
|
||||
}
|
||||
|
||||
.type-card:active {
|
||||
border-color: #E96B6B;
|
||||
background: #FFF5F5;
|
||||
border-color:var(--color-primary);
|
||||
background:var(--color-primary-light);
|
||||
}
|
||||
|
||||
.type-icon {
|
||||
font-size: 40rpx;
|
||||
display: block;
|
||||
margin-bottom: 8rpx;
|
||||
font-size:40rpx;
|
||||
display:block;
|
||||
margin-bottom:8rpx;
|
||||
}
|
||||
|
||||
.type-label {
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
font-weight: 500;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-primary);
|
||||
font-weight:500;
|
||||
}
|
||||
|
||||
.notice {
|
||||
background: #FFF9E6;
|
||||
border-radius: 12rpx;
|
||||
padding: 20rpx 24rpx;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-warning-light);
|
||||
border-radius:12rpx;
|
||||
padding:20rpx 24rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.notice-text {
|
||||
font-size: 24rpx;
|
||||
color: #8B6914;
|
||||
line-height: 1.5;
|
||||
font-size:24rpx;
|
||||
color:var(--color-warning-strong);
|
||||
line-height:1.5;
|
||||
}
|
||||
|
||||
.action-bar {
|
||||
margin-top: 32rpx;
|
||||
padding-bottom: 48rpx;
|
||||
margin-top:32rpx;
|
||||
padding-bottom:48rpx;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
background: #fff;
|
||||
color: #E96B6B;
|
||||
border: 2rpx solid #E96B6B;
|
||||
border-radius: 12rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
background:var(--color-bg-card);
|
||||
color:var(--color-primary-strong);
|
||||
border:2rpx solid var(--color-primary);
|
||||
border-radius:12rpx;
|
||||
font-size:28rpx;
|
||||
font-weight:500;
|
||||
}
|
||||
|
||||
@@ -1,75 +1,75 @@
|
||||
/* 登录页样式 */
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: linear-gradient(180deg, #FFF5F5 0%, #FFFFFF 60%);
|
||||
padding: 0 48rpx;
|
||||
min-height:100vh;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
background:linear-gradient(180deg, var(--color-primary-light) 0%, var(--color-bg-card) 60%);
|
||||
padding:0 48rpx;
|
||||
}
|
||||
|
||||
.logo-area {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding-top: 160rpx;
|
||||
flex:1;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
padding-top:160rpx;
|
||||
}
|
||||
|
||||
.logo-icon {
|
||||
font-size: 120rpx;
|
||||
margin-bottom: 24rpx;
|
||||
font-size:120rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.brand-name {
|
||||
font-size: 44rpx;
|
||||
font-weight: 700;
|
||||
color: #2D2D2D;
|
||||
margin-bottom: 12rpx;
|
||||
font-size:44rpx;
|
||||
font-weight:700;
|
||||
color:var(--color-text-strong);
|
||||
margin-bottom:12rpx;
|
||||
}
|
||||
|
||||
.slogan {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
font-size:28rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.login-content {
|
||||
padding-bottom: 80rpx;
|
||||
padding-bottom:80rpx;
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
width: 100%;
|
||||
height: 96rpx;
|
||||
line-height: 96rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
border-radius: 48rpx;
|
||||
border: none;
|
||||
width:100%;
|
||||
height:96rpx;
|
||||
line-height:96rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
font-size:32rpx;
|
||||
font-weight:600;
|
||||
border-radius:48rpx;
|
||||
border:none;
|
||||
}
|
||||
|
||||
.login-btn.loading {
|
||||
opacity: 0.7;
|
||||
opacity:0.7;
|
||||
}
|
||||
|
||||
.login-hint {
|
||||
margin-top: 24rpx;
|
||||
text-align: center;
|
||||
margin-top:24rpx;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.error-text {
|
||||
font-size: 26rpx;
|
||||
color: #e74c3c;
|
||||
font-size:26rpx;
|
||||
color:var(--color-danger-strong);
|
||||
}
|
||||
|
||||
.login-agreement {
|
||||
margin-top: 48rpx;
|
||||
text-align: center;
|
||||
font-size: 22rpx;
|
||||
color: #bbb;
|
||||
margin-top:48rpx;
|
||||
text-align:center;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-disabled);
|
||||
}
|
||||
|
||||
.login-agreement .link {
|
||||
color: #E96B6B;
|
||||
color:var(--color-primary-strong);
|
||||
}
|
||||
|
||||
@@ -1,82 +1,82 @@
|
||||
.page {
|
||||
padding: 32rpx;
|
||||
background: #FFF8F7;
|
||||
min-height: 100vh;
|
||||
padding:32rpx;
|
||||
background:var(--color-primary-lighter);
|
||||
min-height:100vh;
|
||||
}
|
||||
|
||||
.section {
|
||||
background: #fff;
|
||||
border-radius: 24rpx;
|
||||
padding: 32rpx;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:24rpx;
|
||||
padding:32rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
margin-bottom: 24rpx;
|
||||
display: block;
|
||||
font-size:30rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
margin-bottom:24rpx;
|
||||
display:block;
|
||||
}
|
||||
|
||||
.type-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 16rpx;
|
||||
display:grid;
|
||||
grid-template-columns:1fr 1fr;
|
||||
gap:16rpx;
|
||||
}
|
||||
|
||||
.type-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 28rpx 16rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #F8F8F8;
|
||||
border: 2rpx solid transparent;
|
||||
transition: all 0.2s;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
padding:28rpx 16rpx;
|
||||
border-radius:16rpx;
|
||||
background:var(--color-bg-subtle);
|
||||
border:2rpx solid transparent;
|
||||
transition:all 0.2s;
|
||||
}
|
||||
|
||||
.type-item.selected {
|
||||
background: #FFF3F2;
|
||||
border-color: #E96B6B;
|
||||
background:var(--color-primary-light);
|
||||
border-color:var(--color-primary);
|
||||
}
|
||||
|
||||
.type-icon {
|
||||
font-size: 48rpx;
|
||||
margin-bottom: 12rpx;
|
||||
font-size:48rpx;
|
||||
margin-bottom:12rpx;
|
||||
}
|
||||
|
||||
.type-name {
|
||||
font-size: 24rpx;
|
||||
color: #333;
|
||||
text-align: center;
|
||||
line-height: 1.4;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-primary);
|
||||
text-align:center;
|
||||
line-height:1.4;
|
||||
}
|
||||
|
||||
.textarea {
|
||||
width: 100%;
|
||||
height: 200rpx;
|
||||
background: #F8F8F8;
|
||||
border-radius: 16rpx;
|
||||
padding: 20rpx;
|
||||
font-size: 28rpx;
|
||||
box-sizing: border-box;
|
||||
width:100%;
|
||||
height:200rpx;
|
||||
background:var(--color-bg-subtle);
|
||||
border-radius:16rpx;
|
||||
padding:20rpx;
|
||||
font-size:28rpx;
|
||||
box-sizing:border-box;
|
||||
}
|
||||
|
||||
.char-count {
|
||||
display: block;
|
||||
text-align: right;
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
margin-top: 8rpx;
|
||||
display:block;
|
||||
text-align:right;
|
||||
font-size:22rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
margin-top:8rpx;
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
border-radius: 44rpx;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
font-size: 32rpx;
|
||||
margin-top: 40rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
border-radius:44rpx;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
font-size:32rpx;
|
||||
margin-top:40rpx;
|
||||
}
|
||||
|
||||
@@ -1,115 +1,115 @@
|
||||
/* 红娘工作台登录页样式 */
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: linear-gradient(180deg, #E96B6B 0%, #ff9a9a 100%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0 48rpx;
|
||||
min-height:100vh;
|
||||
background:linear-gradient(180deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
padding:0 48rpx;
|
||||
}
|
||||
|
||||
.header {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 120rpx 0;
|
||||
flex:1;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
padding:120rpx 0;
|
||||
}
|
||||
|
||||
.logo {
|
||||
font-size: 120rpx;
|
||||
margin-bottom: 24rpx;
|
||||
font-size:120rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 40rpx;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
margin-bottom: 12rpx;
|
||||
font-size:40rpx;
|
||||
font-weight:700;
|
||||
color:var(--color-text-inverse);
|
||||
margin-bottom:12rpx;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-size: 28rpx;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
padding: 8rpx 32rpx;
|
||||
border-radius: 20rpx;
|
||||
font-size:28rpx;
|
||||
color:rgba(255, 255, 255, 0.8);
|
||||
background:rgba(255, 255, 255, 0.2);
|
||||
padding:8rpx 32rpx;
|
||||
border-radius:20rpx;
|
||||
}
|
||||
|
||||
.form {
|
||||
background: #fff;
|
||||
border-radius: 32rpx 32rpx 0 0;
|
||||
padding: 64rpx 48rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:32rpx 32rpx 0 0;
|
||||
padding:64rpx 48rpx;
|
||||
}
|
||||
|
||||
.input-group {
|
||||
margin-bottom: 40rpx;
|
||||
margin-bottom:40rpx;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
margin-bottom: 16rpx;
|
||||
font-weight: 500;
|
||||
display:block;
|
||||
font-size:28rpx;
|
||||
color:var(--color-text-primary);
|
||||
margin-bottom:16rpx;
|
||||
font-weight:500;
|
||||
}
|
||||
|
||||
.input {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
border: 2rpx solid #e0e0e0;
|
||||
border-radius: 16rpx;
|
||||
padding: 0 24rpx;
|
||||
font-size: 32rpx;
|
||||
box-sizing: border-box;
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
border:2rpx solid var(--color-border-strong);
|
||||
border-radius:16rpx;
|
||||
padding:0 24rpx;
|
||||
font-size:32rpx;
|
||||
box-sizing:border-box;
|
||||
}
|
||||
|
||||
.input:focus {
|
||||
border-color: #E96B6B;
|
||||
border-color:var(--color-primary);
|
||||
}
|
||||
|
||||
.error-tip {
|
||||
background: #fff2f0;
|
||||
border: 1rpx solid #ffccc7;
|
||||
border-radius: 8rpx;
|
||||
padding: 16rpx 24rpx;
|
||||
margin-bottom: 32rpx;
|
||||
background:var(--color-primary-light);
|
||||
border:1rpx solid var(--color-primary-light);
|
||||
border-radius:8rpx;
|
||||
padding:16rpx 24rpx;
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.error-tip text {
|
||||
color: #ff4d4f;
|
||||
font-size: 26rpx;
|
||||
color:var(--color-danger-strong);
|
||||
font-size:26rpx;
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
width: 100%;
|
||||
height: 96rpx;
|
||||
line-height: 96rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
border-radius: 48rpx;
|
||||
border: none;
|
||||
width:100%;
|
||||
height:96rpx;
|
||||
line-height:96rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
font-size:32rpx;
|
||||
font-weight:600;
|
||||
border-radius:48rpx;
|
||||
border:none;
|
||||
}
|
||||
|
||||
.login-btn[disabled] {
|
||||
opacity: 0.6;
|
||||
opacity:0.6;
|
||||
}
|
||||
|
||||
.footer-link {
|
||||
text-align: center;
|
||||
margin-top: 32rpx;
|
||||
text-align:center;
|
||||
margin-top:32rpx;
|
||||
}
|
||||
|
||||
.footer-link text {
|
||||
color: #999;
|
||||
font-size: 26rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
font-size:26rpx;
|
||||
}
|
||||
|
||||
.hint {
|
||||
text-align: center;
|
||||
padding: 40rpx;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
font-size: 24rpx;
|
||||
text-align:center;
|
||||
padding:40rpx;
|
||||
color:rgba(255, 255, 255, 0.7);
|
||||
font-size:24rpx;
|
||||
}
|
||||
|
||||
@@ -1,142 +1,142 @@
|
||||
.page {
|
||||
padding: 32rpx;
|
||||
background: #FFF8F7;
|
||||
min-height: 100vh;
|
||||
padding:32rpx;
|
||||
background:var(--color-primary-lighter);
|
||||
min-height:100vh;
|
||||
}
|
||||
|
||||
.status-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16rpx;
|
||||
background: #fff;
|
||||
border-radius: 24rpx;
|
||||
padding: 32rpx;
|
||||
margin-bottom: 24rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
gap:16rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:24rpx;
|
||||
padding:32rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.status-dot {
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
border-radius: 50%;
|
||||
flex-shrink: 0;
|
||||
width:20rpx;
|
||||
height:20rpx;
|
||||
border-radius:50%;
|
||||
flex-shrink:0;
|
||||
}
|
||||
|
||||
.status-text {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
font-size:32rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
}
|
||||
|
||||
.info-card {
|
||||
background: #fff;
|
||||
border-radius: 24rpx;
|
||||
padding: 32rpx;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:24rpx;
|
||||
padding:32rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.info-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 16rpx 0;
|
||||
border-bottom: 1rpx solid #f5f5f5;
|
||||
display:flex;
|
||||
justify-content:space-between;
|
||||
padding:16rpx 0;
|
||||
border-bottom:1rpx solid var(--color-divider);
|
||||
}
|
||||
|
||||
.info-row:last-child {
|
||||
border-bottom: none;
|
||||
border-bottom:none;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.info-value {
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
text-align: right;
|
||||
max-width: 55%;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-primary);
|
||||
text-align:right;
|
||||
max-width:55%;
|
||||
}
|
||||
|
||||
.info-value.desc {
|
||||
text-align: right;
|
||||
line-height: 1.6;
|
||||
text-align:right;
|
||||
line-height:1.6;
|
||||
}
|
||||
|
||||
.notice {
|
||||
background: #fff;
|
||||
border-radius: 24rpx;
|
||||
padding: 32rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:24rpx;
|
||||
padding:32rpx;
|
||||
}
|
||||
|
||||
.notice-title {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
margin-bottom: 24rpx;
|
||||
display: block;
|
||||
font-size:28rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-primary);
|
||||
margin-bottom:24rpx;
|
||||
display:block;
|
||||
}
|
||||
|
||||
.steps {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
display:flex;
|
||||
justify-content:space-between;
|
||||
}
|
||||
|
||||
.step {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
gap:8rpx;
|
||||
}
|
||||
|
||||
.step-num {
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
border-radius: 50%;
|
||||
background: #EEE;
|
||||
color: #999;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 24rpx;
|
||||
width:48rpx;
|
||||
height:48rpx;
|
||||
border-radius:50%;
|
||||
background:var(--color-bg-subtle);
|
||||
color:var(--color-text-tertiary);
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
font-size:24rpx;
|
||||
}
|
||||
|
||||
.step.active .step-num, .step.done .step-num {
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
}
|
||||
|
||||
.step-text {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.step.active .step-text, .step.done .step-text {
|
||||
color: #333;
|
||||
color:var(--color-text-primary);
|
||||
}
|
||||
|
||||
.empty {
|
||||
text-align: center;
|
||||
padding: 120rpx 40rpx;
|
||||
text-align:center;
|
||||
padding:120rpx 40rpx;
|
||||
}
|
||||
|
||||
.empty-desc {
|
||||
display: block;
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
margin: 16rpx 0 40rpx;
|
||||
display:block;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
margin:16rpx 0 40rpx;
|
||||
}
|
||||
|
||||
.btn-apply {
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
border-radius: 44rpx;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
font-size: 30rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
border-radius:44rpx;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
font-size:30rpx;
|
||||
}
|
||||
|
||||
.loading {
|
||||
text-align: center;
|
||||
padding: 120rpx;
|
||||
color: #999;
|
||||
text-align:center;
|
||||
padding:120rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
@@ -1,266 +1,266 @@
|
||||
/* 页面容器 */
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #f5f6fa;
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-subtle);
|
||||
}
|
||||
|
||||
/* 欢迎区 */
|
||||
.header {
|
||||
background: linear-gradient(135deg, #E96B6B 0%, #ff9a9a 100%);
|
||||
padding: 48rpx 32rpx 60rpx;
|
||||
color: #fff;
|
||||
position: relative;
|
||||
background:linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
|
||||
padding:48rpx 32rpx 60rpx;
|
||||
color:var(--color-text-inverse);
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.header-top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 24rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
gap:24rpx;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
background: rgba(255,255,255,0.25);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 44rpx;
|
||||
width:88rpx;
|
||||
height:88rpx;
|
||||
background:rgba(255,255,255,0.25);
|
||||
border-radius:50%;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
font-size:44rpx;
|
||||
}
|
||||
|
||||
.greeting {
|
||||
font-size: 38rpx;
|
||||
font-weight: 700;
|
||||
margin-bottom: 6rpx;
|
||||
font-size:38rpx;
|
||||
font-weight:700;
|
||||
margin-bottom:6rpx;
|
||||
}
|
||||
|
||||
.date {
|
||||
font-size: 24rpx;
|
||||
opacity: 0.85;
|
||||
font-size:24rpx;
|
||||
opacity:0.85;
|
||||
}
|
||||
|
||||
.header-badge {
|
||||
margin: 12rpx 0 0 112rpx;
|
||||
background: rgba(255,255,255,0.25);
|
||||
padding: 6rpx 20rpx;
|
||||
border-radius: 20rpx;
|
||||
font-size: 22rpx;
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
background: rgba(255,255,255,0.2);
|
||||
padding: 8rpx 24rpx;
|
||||
border-radius: 24rpx;
|
||||
font-size: 22rpx;
|
||||
margin:12rpx 0 0 112rpx;
|
||||
background:rgba(255,255,255,0.25);
|
||||
padding:6rpx 20rpx;
|
||||
border-radius:20rpx;
|
||||
font-size:22rpx;
|
||||
color:var(--color-text-inverse);
|
||||
display:inline-block;
|
||||
background:rgba(255,255,255,0.2);
|
||||
padding:8rpx 24rpx;
|
||||
border-radius:24rpx;
|
||||
font-size:22rpx;
|
||||
}
|
||||
|
||||
/* 数据概览 - 2x2 网格 */
|
||||
.stats-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding: 0 24rpx;
|
||||
margin-top: 24rpx;
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
display:flex;
|
||||
flex-wrap:wrap;
|
||||
padding:0 24rpx;
|
||||
margin-top:24rpx;
|
||||
position:relative;
|
||||
z-index:10;
|
||||
}
|
||||
|
||||
.stat-card {
|
||||
width: calc(50% - 16rpx);
|
||||
margin: 0 8rpx 24rpx 8rpx;
|
||||
background: #fff;
|
||||
border-radius: 24rpx;
|
||||
padding: 40rpx 20rpx;
|
||||
text-align: center;
|
||||
box-shadow: 0 8rpx 32rpx rgba(0,0,0,0.1);
|
||||
box-sizing: border-box;
|
||||
width:calc(50% - 16rpx);
|
||||
margin:0 8rpx 24rpx 8rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:24rpx;
|
||||
padding:40rpx 20rpx;
|
||||
text-align:center;
|
||||
box-shadow:0 8rpx 32rpx rgba(0,0,0,0.1);
|
||||
box-sizing:border-box;
|
||||
}
|
||||
|
||||
.stat-icon {
|
||||
font-size: 48rpx;
|
||||
margin-bottom: 16rpx;
|
||||
font-size:48rpx;
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.stat-value {
|
||||
font-size: 56rpx;
|
||||
font-weight: 700;
|
||||
color: #1a1a1a;
|
||||
line-height: 1.2;
|
||||
margin-bottom: 8rpx;
|
||||
font-size:56rpx;
|
||||
font-weight:700;
|
||||
color:var(--color-text-strong);
|
||||
line-height:1.2;
|
||||
margin-bottom:8rpx;
|
||||
}
|
||||
|
||||
.stat-label {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
/* 列表区块 */
|
||||
.section {
|
||||
margin: 0 24rpx 24rpx;
|
||||
background: #fff;
|
||||
border-radius: 24rpx;
|
||||
padding: 32rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.04);
|
||||
margin:0 24rpx 24rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:24rpx;
|
||||
padding:32rpx;
|
||||
box-shadow:0 2rpx 12rpx rgba(0,0,0,0.04);
|
||||
}
|
||||
|
||||
.section-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 24rpx;
|
||||
display:flex;
|
||||
justify-content:space-between;
|
||||
align-items:center;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.section-title-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
gap:12rpx;
|
||||
}
|
||||
|
||||
.section-dot {
|
||||
width: 6rpx;
|
||||
height: 28rpx;
|
||||
background: linear-gradient(180deg, #E96B6B 0%, #ff9a9a 100%);
|
||||
border-radius: 3rpx;
|
||||
width:6rpx;
|
||||
height:28rpx;
|
||||
background:linear-gradient(180deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
|
||||
border-radius:3rpx;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 30rpx;
|
||||
font-weight: 600;
|
||||
color: #1a1a1a;
|
||||
font-size:30rpx;
|
||||
font-weight:600;
|
||||
color:var(--color-text-strong);
|
||||
}
|
||||
|
||||
.section-count {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
background: #f5f5f5;
|
||||
padding: 4rpx 14rpx;
|
||||
border-radius: 12rpx;
|
||||
font-size:22rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
background:var(--color-bg-subtle);
|
||||
padding:4rpx 14rpx;
|
||||
border-radius:12rpx;
|
||||
}
|
||||
|
||||
/* 服务列表 */
|
||||
.service-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:16rpx;
|
||||
}
|
||||
|
||||
.service-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 24rpx;
|
||||
background: #fafafa;
|
||||
border-radius: 16rpx;
|
||||
border: 1rpx solid #f0f0f0;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
padding:24rpx;
|
||||
background:var(--color-bg-subtle);
|
||||
border-radius:16rpx;
|
||||
border:1rpx solid var(--color-divider);
|
||||
}
|
||||
|
||||
.service-left {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
margin-right: 20rpx;
|
||||
flex:1;
|
||||
min-width:0;
|
||||
margin-right:20rpx;
|
||||
}
|
||||
|
||||
.service-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 8rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
margin-bottom:8rpx;
|
||||
}
|
||||
|
||||
.service-tag {
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
color: #E96B6B;
|
||||
background: rgba(233, 107, 107, 0.08);
|
||||
padding: 4rpx 12rpx;
|
||||
border-radius: 6rpx;
|
||||
font-size:24rpx;
|
||||
font-weight:600;
|
||||
color:var(--color-primary-strong);
|
||||
background:rgba(233, 107, 107, 0.08);
|
||||
padding:4rpx 12rpx;
|
||||
border-radius:6rpx;
|
||||
}
|
||||
|
||||
.service-time {
|
||||
font-size: 20rpx;
|
||||
color: #bbb;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-disabled);
|
||||
}
|
||||
|
||||
.service-desc {
|
||||
font-size: 26rpx;
|
||||
color: #555;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-primary);
|
||||
overflow:hidden;
|
||||
text-overflow:ellipsis;
|
||||
white-space:nowrap;
|
||||
}
|
||||
|
||||
.btn-claim {
|
||||
background: linear-gradient(135deg, #E96B6B 0%, #ff8a80 100%);
|
||||
color: #fff;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
padding: 12rpx 32rpx;
|
||||
border-radius: 24rpx;
|
||||
border: none;
|
||||
box-shadow: 0 4rpx 12rpx rgba(233, 107, 107, 0.25);
|
||||
background:linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
|
||||
color:var(--color-text-inverse);
|
||||
font-size:24rpx;
|
||||
font-weight:600;
|
||||
padding:12rpx 32rpx;
|
||||
border-radius:24rpx;
|
||||
border:none;
|
||||
box-shadow:0 4rpx 12rpx rgba(233, 107, 107, 0.25);
|
||||
}
|
||||
|
||||
/* 空状态 */
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 80rpx 40rpx;
|
||||
text-align:center;
|
||||
padding:80rpx 40rpx;
|
||||
}
|
||||
|
||||
.empty-illustration {
|
||||
font-size: 88rpx;
|
||||
margin-bottom: 16rpx;
|
||||
opacity: 0.5;
|
||||
font-size:88rpx;
|
||||
margin-bottom:16rpx;
|
||||
opacity:0.5;
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
margin-bottom: 6rpx;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
margin-bottom:6rpx;
|
||||
}
|
||||
|
||||
.empty-hint {
|
||||
font-size: 22rpx;
|
||||
color: #ccc;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-disabled);
|
||||
}
|
||||
|
||||
/* 加载中 */
|
||||
.loading-wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 120rpx 0;
|
||||
gap: 20rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
padding:120rpx 0;
|
||||
gap:20rpx;
|
||||
}
|
||||
|
||||
.loading-spinner {
|
||||
width: 44rpx;
|
||||
height: 44rpx;
|
||||
border: 4rpx solid #f0f0f0;
|
||||
border-top-color: #E96B6B;
|
||||
border-radius: 50%;
|
||||
animation: spin 0.8s linear infinite;
|
||||
width:44rpx;
|
||||
height:44rpx;
|
||||
border:4rpx solid var(--color-divider);
|
||||
border-top-color:var(--color-primary);
|
||||
border-radius:50%;
|
||||
animation:spin 0.8s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
to { transform: rotate(360deg); }
|
||||
to { transform:rotate(360deg); }
|
||||
}
|
||||
|
||||
.loading-text {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
/* 底部退出 */
|
||||
.footer {
|
||||
padding: 40rpx 32rpx 20rpx;
|
||||
padding:40rpx 32rpx 20rpx;
|
||||
}
|
||||
|
||||
.logout-btn {
|
||||
width: 100%;
|
||||
height: 84rpx;
|
||||
line-height: 84rpx;
|
||||
background: #fff;
|
||||
color: #999;
|
||||
font-size: 28rpx;
|
||||
border-radius: 42rpx;
|
||||
border: 2rpx solid #e8e8e8;
|
||||
}
|
||||
width:100%;
|
||||
min-height:var(--tap-min);
|
||||
line-height:var(--tap-min);
|
||||
background:var(--color-bg-card);
|
||||
color:var(--color-text-tertiary);
|
||||
font-size:28rpx;
|
||||
border-radius:42rpx;
|
||||
border:2rpx solid var(--color-border);
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
@@ -1 +1 @@
|
||||
.mm-page{min-height:100vh;padding-bottom:calc(136rpx + env(safe-area-inset-bottom));background:#F4F5FA}.mm-promises{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,1fr);margin:-22rpx 24rpx 0;padding:22rpx 8rpx;border-radius:28rpx;background:#fff;box-shadow:var(--mini-shadow)}.mm-promise{display:flex;flex-direction:column;align-items:center;padding:0 8rpx;text-align:center;color:#8A8FA4;font-size:17rpx;line-height:1.35}.mm-promise image{width:46rpx;height:46rpx;margin-bottom:8rpx}.mm-promise__title{margin-bottom:4rpx;color:#303654;font-size:21rpx;font-weight:650}.mm-loading{padding:30rpx 24rpx}.mm-body{padding-top:8rpx}.mm-section{padding:8rpx 24rpx}.mm-no-service{display:flex;align-items:center;gap:18rpx;margin-top:10rpx;padding:24rpx;border-radius:26rpx;background:#fff;box-shadow:0 8rpx 28rpx rgba(35,35,95,.06)}.mm-no-service image{width:68rpx;height:68rpx}.mm-no-service>view{display:flex;flex:1;flex-direction:column}.mm-no-service__title{color:#283056;font-size:25rpx;font-weight:650}.mm-no-service__desc{margin-top:7rpx;color:#858A9E;font-size:20rpx;line-height:1.5}.mm-capability-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14rpx;margin-top:10rpx}.mm-capability{display:flex;align-items:center;gap:12rpx;min-height:88rpx;padding:16rpx;border-radius:22rpx;background:#fff;color:#555D79;font-size:20rpx;line-height:1.4;box-shadow:0 8rpx 24rpx rgba(35,35,95,.05)}.mm-capability image{width:36rpx;height:36rpx;flex:none}.mm-history{overflow:hidden;margin-top:10rpx;border-radius:24rpx;background:#fff}.mm-history__item{display:flex;align-items:center;min-height:92rpx;padding:0 20rpx;border-bottom:1rpx solid #EFF0F5}.mm-history__item:last-child{border-bottom:0}.mm-history__item>view{display:flex;flex:1;flex-direction:column}.mm-history__title{color:#303654;font-size:23rpx;font-weight:600}.mm-history__meta{margin-top:5rpx;color:#8A8FA4;font-size:18rpx}.mm-history__status{margin-right:8rpx;color:#8A6F91;font-size:19rpx}.mm-history__item>image{width:24rpx;height:24rpx}.mm-fixed-action{position:fixed;z-index:100;right:0;bottom:0;left:0;padding:18rpx 24rpx calc(18rpx + env(safe-area-inset-bottom));border-top:1rpx solid #EFF0F5;background:rgba(255,255,255,.96)}.mm-apply{display:flex;align-items:center;justify-content:center;height:88rpx;border-radius:44rpx;background:linear-gradient(135deg,var(--mini-accent-coral),var(--mini-accent-pink));color:#fff;font-size:28rpx;font-weight:650;box-shadow:0 10rpx 24rpx rgba(255,92,130,.22)}
|
||||
.mm-page{min-height:100vh;padding-bottom:calc(136rpx + env(safe-area-inset-bottom));background:var(--color-bg-page)}.mm-promises{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,1fr);margin:-22rpx 24rpx 0;padding:22rpx 8rpx;border-radius:28rpx;background:var(--color-bg-card);box-shadow:var(--mini-shadow)}.mm-promise{display:flex;flex-direction:column;align-items:center;padding:0 8rpx;text-align:center;color:var(--color-text-tertiary);font-size:24rpx;line-height:1.35}.mm-promise image{width:46rpx;height:46rpx;margin-bottom:8rpx}.mm-promise__title{margin-bottom:4rpx;color:var(--color-text-strong);font-size:24rpx;font-weight:600}.mm-loading{padding:30rpx 24rpx}.mm-body{padding-top:8rpx}.mm-section{padding:8rpx 24rpx}.mm-no-service{display:flex;align-items:center;gap:18rpx;margin-top:10rpx;padding:24rpx;border-radius:26rpx;background:var(--color-bg-card);box-shadow:0 8rpx 28rpx rgba(35,35,95,.06)}.mm-no-service image{width:68rpx;height:68rpx}.mm-no-service>view{display:flex;flex:1;flex-direction:column}.mm-no-service__title{color:var(--color-text-strong);font-size:25rpx;font-weight:600}.mm-no-service__desc{margin-top:7rpx;color:var(--color-text-tertiary);font-size:24rpx;line-height:1.5}.mm-capability-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14rpx;margin-top:10rpx}.mm-capability{display:flex;align-items:center;gap:12rpx;min-height:88rpx;padding:16rpx;border-radius:22rpx;background:var(--color-bg-card);color:var(--color-text-secondary);font-size:24rpx;line-height:1.4;box-shadow:0 8rpx 24rpx rgba(35,35,95,.05)}.mm-capability image{width:36rpx;height:36rpx;flex:none}.mm-history{overflow:hidden;margin-top:10rpx;border-radius:24rpx;background:var(--color-bg-card)}.mm-history__item{display:flex;align-items:center;min-height:92rpx;padding:0 20rpx;border-bottom:1rpx solid var(--color-divider)}.mm-history__item:last-child{border-bottom:0}.mm-history__item>view{display:flex;flex:1;flex-direction:column}.mm-history__title{color:var(--color-text-strong);font-size:24rpx;font-weight:600}.mm-history__meta{margin-top:5rpx;color:var(--color-text-tertiary);font-size:24rpx}.mm-history__status{margin-right:8rpx;color:var(--color-accent-purple-strong);font-size:24rpx}.mm-history__item>image{width:24rpx;height:24rpx}.mm-fixed-action{position:fixed;z-index:100;right:0;bottom:0;left:0;padding:18rpx 24rpx calc(18rpx + env(safe-area-inset-bottom));border-top:1rpx solid var(--color-divider);background:rgba(255,255,255,.96)}.mm-apply{display:flex;align-items:center;justify-content:center;height:88rpx;border-radius:44rpx;background:var(--gradient-brand-solid);color:var(--color-text-inverse);font-size:28rpx;font-weight:600;box-shadow:0 10rpx 24rpx rgba(255,92,130,.22)}
|
||||
|
||||
@@ -1,79 +1,79 @@
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #f4f5fa;
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-page);
|
||||
}
|
||||
|
||||
.messages-hero {
|
||||
padding: env(safe-area-inset-top) 24rpx 34rpx;
|
||||
border-radius: 0 0 36rpx 36rpx;
|
||||
background: linear-gradient(160deg, var(--mini-night-start), var(--mini-night-end));
|
||||
box-shadow: var(--mini-shadow);
|
||||
padding:env(safe-area-inset-top) 24rpx 34rpx;
|
||||
border-radius:0 0 36rpx 36rpx;
|
||||
background:linear-gradient(160deg, var(--mini-night-start), var(--mini-night-end));
|
||||
box-shadow:var(--mini-shadow);
|
||||
}
|
||||
|
||||
.messages-nav {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 88rpx;
|
||||
position:relative;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
height:88rpx;
|
||||
}
|
||||
|
||||
.messages-title {
|
||||
color: #fff;
|
||||
font-size: 31rpx;
|
||||
font-weight: 700;
|
||||
color:var(--color-text-inverse);
|
||||
font-size:31rpx;
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
.messages-search {
|
||||
position: absolute;
|
||||
right: 14rpx;
|
||||
width: 34rpx;
|
||||
height: 34rpx;
|
||||
position:absolute;
|
||||
right:14rpx;
|
||||
width:34rpx;
|
||||
height:34rpx;
|
||||
}
|
||||
|
||||
.message-shortcuts {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
padding: 22rpx 8rpx 4rpx;
|
||||
display:grid;
|
||||
grid-template-columns:repeat(4, 1fr);
|
||||
padding:22rpx 8rpx 4rpx;
|
||||
}
|
||||
|
||||
.message-shortcut {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
color: rgba(255, 255, 255, .88);
|
||||
font-size: 20rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
color:rgba(255, 255, 255, .88);
|
||||
font-size:24rpx;
|
||||
}
|
||||
|
||||
.shortcut-icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 72rpx;
|
||||
height: 72rpx;
|
||||
margin-bottom: 12rpx;
|
||||
border: 1rpx solid rgba(255, 255, 255, .2);
|
||||
border-radius: 26rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
width:72rpx;
|
||||
height:72rpx;
|
||||
margin-bottom:12rpx;
|
||||
border:1rpx solid rgba(255, 255, 255, .2);
|
||||
border-radius:26rpx;
|
||||
}
|
||||
|
||||
.shortcut-icon image {
|
||||
width: 45rpx;
|
||||
height: 45rpx;
|
||||
width:45rpx;
|
||||
height:45rpx;
|
||||
}
|
||||
|
||||
.shortcut-icon--blue { background: rgba(79, 139, 255, .28); }
|
||||
.shortcut-icon--pink { background: rgba(255, 92, 130, .28); }
|
||||
.shortcut-icon--purple { background: rgba(154, 107, 255, .28); }
|
||||
.shortcut-icon--coral { background: rgba(240, 106, 100, .28); }
|
||||
.shortcut-icon--blue { background:rgba(79, 139, 255, .28); }
|
||||
.shortcut-icon--pink { background:rgba(255, 92, 130, .28); }
|
||||
.shortcut-icon--purple { background:rgba(154, 107, 255, .28); }
|
||||
.shortcut-icon--coral { background:rgba(240, 106, 100, .28); }
|
||||
|
||||
.messages-content {
|
||||
padding: 16rpx 24rpx 40rpx;
|
||||
padding:16rpx 24rpx 40rpx;
|
||||
}
|
||||
|
||||
.conversation-list {
|
||||
overflow: hidden;
|
||||
margin-top: 8rpx;
|
||||
border-radius: 28rpx;
|
||||
background: #fff;
|
||||
box-shadow: 0 10rpx 32rpx rgba(34, 35, 91, .08);
|
||||
overflow:hidden;
|
||||
margin-top:8rpx;
|
||||
border-radius:28rpx;
|
||||
background:var(--color-bg-card);
|
||||
box-shadow:0 10rpx 32rpx rgba(34, 35, 91, .08);
|
||||
}
|
||||
|
||||
@@ -1 +1 @@
|
||||
.page{min-height:100vh;padding-bottom:48rpx;background:#F4F5FA}.mine-guest{min-height:100vh;background:linear-gradient(160deg,var(--mini-night-start) 0,var(--mini-night-end) 34%,#F4F5FA 34%)}.guest-brand{display:flex;flex-direction:column;align-items:center;padding:calc(env(safe-area-inset-top) + 70rpx) 0 80rpx;color:#fff}.guest-brand image{width:92rpx;height:92rpx}.guest-brand>text{margin-top:12rpx;font-size:34rpx;font-weight:700}.guest-brand .guest-subtitle{margin-top:5rpx;color:rgba(255,255,255,.72);font-size:20rpx;font-weight:400;letter-spacing:4rpx}.profile-hero{padding:env(safe-area-inset-top) 24rpx 54rpx;border-radius:0 0 42rpx 42rpx;background:linear-gradient(160deg,var(--mini-night-start),var(--mini-night-end));box-shadow:var(--mini-shadow)}.mine-nav{position:relative;display:flex;align-items:center;justify-content:center;height:88rpx;color:#fff;font-size:31rpx;font-weight:700}.mine-nav image{position:absolute;right:12rpx;width:36rpx;height:36rpx;filter:brightness(0) invert(1)}.profile-main{position:relative;display:flex;align-items:center}.profile-copy{flex:1;min-width:0;margin-left:20rpx;color:#fff}.profile-name-row{display:flex;align-items:center;gap:12rpx}.profile-name{font-size:31rpx;font-weight:700}.profile-status{padding:5rpx 10rpx;border-radius:15rpx;background:rgba(255,255,255,.12);color:rgba(255,255,255,.78);font-size:17rpx}.profile-meta{display:block;margin-top:8rpx;color:rgba(255,255,255,.72);font-size:20rpx}.profile-progress{width:78%;height:7rpx;margin:10rpx 0 13rpx;overflow:hidden;border-radius:8rpx;background:rgba(255,255,255,.14)}.profile-progress view{height:100%;border-radius:8rpx;background:linear-gradient(90deg,#FF8C9C,#FF5C82)}.profile-badges{display:flex;gap:8rpx}.edit-profile{position:absolute;right:0;top:4rpx;color:rgba(255,255,255,.82);font-size:19rpx}.profile-stats{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);margin:-24rpx 24rpx 0;padding:24rpx 8rpx;border-radius:28rpx;background:#fff;box-shadow:var(--mini-shadow)}.profile-stat{display:flex;flex-direction:column;align-items:center;border-right:1rpx solid #EFF0F5}.profile-stat:last-child{border-right:0}.stat-value{color:#283056;font-size:29rpx;font-weight:700}.stat-value--text{font-size:22rpx}.stat-label{margin-top:5rpx;color:#8A8FA4;font-size:18rpx}.public-identity-card{display:flex;align-items:center;margin:24rpx;padding:22rpx;border-radius:26rpx;background:linear-gradient(135deg,#FFF0F5,#F7EEFF);box-shadow:0 8rpx 26rpx rgba(87,62,145,.08)}.public-identity-card>image:first-child{width:72rpx;height:72rpx}.public-identity-card>view{flex:1;display:flex;flex-direction:column;margin-left:16rpx}.identity-title{color:#F14D79;font-size:26rpx;font-weight:700}.identity-desc{margin-top:5rpx;color:#8A6F91;font-size:19rpx}.public-identity-card .identity-arrow{width:26rpx;height:26rpx}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);margin:0 24rpx 28rpx;padding:24rpx 8rpx;border-radius:26rpx;background:#fff;box-shadow:0 8rpx 28rpx rgba(35,35,95,.07)}.service-entry{display:flex;flex-direction:column;align-items:center;color:#343957;font-size:20rpx}.service-icon{display:flex;align-items:center;justify-content:center;width:64rpx;height:64rpx;margin-bottom:10rpx;border-radius:20rpx}.service-icon image{width:42rpx;height:42rpx}.service-icon.rose{background:#FFF0F5}.service-icon.blue{background:#EAF3FF}.service-icon.amber{background:#FFF3E5}.service-icon.green{background:#EAF8F2}.list-group{overflow:hidden;margin:0 24rpx 22rpx;border-radius:26rpx;background:#fff;box-shadow:0 8rpx 28rpx rgba(35,35,95,.06)}.list-row{display:flex;align-items:center;min-height:88rpx;padding:0 24rpx;border-bottom:1rpx solid #EFF0F5}.list-row:last-child{border-bottom:0}.list-label{flex:1;color:#2B304E;font-size:23rpx}.list-value{margin-right:12rpx;color:#8A8FA4;font-size:19rpx}.list-arrow{width:24rpx;height:24rpx}.secondary-list{margin-top:0}.logout-row{margin:26rpx 24rpx 0;padding:24rpx;text-align:center;color:#D95561;font-size:23rpx;background:#fff;border-radius:26rpx}
|
||||
.page{min-height:100vh;padding-bottom:48rpx;background:var(--color-bg-page)}.mine-guest{min-height:100vh;background:linear-gradient(160deg,var(--mini-night-start) 0,var(--mini-night-end) 34%,var(--color-bg-page) 34%)}.guest-brand{display:flex;flex-direction:column;align-items:center;padding:calc(env(safe-area-inset-top) + 70rpx) 0 80rpx;color:var(--color-text-inverse)}.guest-brand image{width:92rpx;height:92rpx}.guest-brand>text{margin-top:12rpx;font-size:34rpx;font-weight:700}.guest-brand .guest-subtitle{margin-top:5rpx;color:rgba(255,255,255,.72);font-size:24rpx;font-weight:400;letter-spacing:4rpx}.profile-hero{padding:env(safe-area-inset-top) 24rpx 54rpx;border-radius:0 0 42rpx 42rpx;background:linear-gradient(160deg,var(--mini-night-start),var(--mini-night-end));box-shadow:var(--mini-shadow)}.mine-nav{position:relative;display:flex;align-items:center;justify-content:center;height:88rpx;color:var(--color-text-inverse);font-size:31rpx;font-weight:700}.mine-nav image{position:absolute;right:12rpx;width:36rpx;height:36rpx;filter:brightness(0) invert(1)}.profile-main{position:relative;display:flex;align-items:center}.profile-copy{flex:1;min-width:0;margin-left:20rpx;color:var(--color-text-inverse)}.profile-name-row{display:flex;align-items:center;gap:12rpx}.profile-name{font-size:31rpx;font-weight:700}.profile-status{padding:5rpx 10rpx;border-radius:15rpx;background:rgba(255,255,255,.12);color:rgba(255,255,255,.78);font-size:24rpx}.profile-meta{display:block;margin-top:8rpx;color:rgba(255,255,255,.72);font-size:24rpx}.profile-progress{width:78%;height:7rpx;margin:10rpx 0 13rpx;overflow:hidden;border-radius:8rpx;background:rgba(255,255,255,.14)}.profile-progress view{height:100%;border-radius:8rpx;background:linear-gradient(90deg,var(--color-primary-light),var(--color-primary-light))}.profile-badges{display:flex;gap:8rpx}.edit-profile{position:absolute;right:0;top:4rpx;color:rgba(255,255,255,.82);font-size:24rpx}.profile-stats{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);margin:-24rpx 24rpx 0;padding:24rpx 8rpx;border-radius:28rpx;background:var(--color-bg-card);box-shadow:var(--mini-shadow)}.profile-stat{display:flex;flex-direction:column;align-items:center;border-right:1rpx solid var(--color-divider)}.profile-stat:last-child{border-right:0}.stat-value{color:var(--color-text-strong);font-size:29rpx;font-weight:700}.stat-value--text{font-size:24rpx}.stat-label{margin-top:5rpx;color:var(--color-text-tertiary);font-size:24rpx}.public-identity-card{display:flex;align-items:center;margin:24rpx;padding:22rpx;border-radius:26rpx;background:linear-gradient(135deg,var(--color-primary-light),var(--color-accent-purple-light));box-shadow:0 8rpx 26rpx rgba(87,62,145,.08)}.public-identity-card>image:first-child{width:72rpx;height:72rpx}.public-identity-card>view{flex:1;display:flex;flex-direction:column;margin-left:16rpx}.identity-title{color:var(--color-primary-strong);font-size:26rpx;font-weight:700}.identity-desc{margin-top:5rpx;color:var(--color-accent-purple-strong);font-size:24rpx}.public-identity-card .identity-arrow{width:26rpx;height:26rpx}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);margin:0 24rpx 28rpx;padding:24rpx 8rpx;border-radius:26rpx;background:var(--color-bg-card);box-shadow:0 8rpx 28rpx rgba(35,35,95,.07)}.service-entry{display:flex;flex-direction:column;align-items:center;color:var(--color-text-strong);font-size:24rpx}.service-icon{display:flex;align-items:center;justify-content:center;width:64rpx;height:64rpx;margin-bottom:10rpx;border-radius:20rpx}.service-icon image{width:42rpx;height:42rpx}.service-icon.rose{background:var(--color-primary-light)}.service-icon.blue{background:var(--color-info-light)}.service-icon.amber{background:var(--color-warning-light)}.service-icon.green{background:var(--color-success-light)}.list-group{overflow:hidden;margin:0 24rpx 22rpx;border-radius:26rpx;background:var(--color-bg-card);box-shadow:0 8rpx 28rpx rgba(35,35,95,.06)}.list-row{display:flex;align-items:center;min-height:88rpx;padding:0 24rpx;border-bottom:1rpx solid var(--color-divider)}.list-row:last-child{border-bottom:0}.list-label{flex:1;color:var(--color-text-strong);font-size:24rpx}.list-value{margin-right:12rpx;color:var(--color-text-tertiary);font-size:24rpx}.list-arrow{width:24rpx;height:24rpx}.secondary-list{margin-top:0}.logout-row{margin:26rpx 24rpx 0;padding:24rpx;text-align:center;color:var(--color-danger-strong);font-size:24rpx;background:var(--color-bg-card);border-radius:26rpx}
|
||||
|
||||
@@ -1 +1 @@
|
||||
.page{padding:32rpx;background:#FFF8F7;min-height:100vh;text-align:center;color:#999;padding-top:200rpx;}
|
||||
.page{padding:32rpx;background:var(--color-primary-lighter);min-height:100vh;text-align:center;color:var(--color-text-tertiary);padding-top:200rpx;}
|
||||
|
||||
@@ -1,19 +1,19 @@
|
||||
.container { padding: 24rpx; }
|
||||
.empty { text-align: center; padding: 80rpx 0; color: #999; }
|
||||
.go-btn { margin-top: 24rpx; background: #FF6B6B; color: #fff; border-radius: 44rpx; font-size: 28rpx; }
|
||||
.card { background: #fff; border-radius: 16rpx; padding: 24rpx; margin-bottom: 20rpx; box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.05); }
|
||||
.card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12rpx; }
|
||||
.card-title { font-size: 32rpx; font-weight: bold; color: #333; }
|
||||
.card-status { font-size: 24rpx; padding: 4rpx 16rpx; border-radius: 20rpx; }
|
||||
.status-pending { background: #fff3e0; color: #e65100; }
|
||||
.status-assigned { background: #e3f2fd; color: #1565c0; }
|
||||
.status-scheduled { background: #e8f5e9; color: #2e7d32; }
|
||||
.status-in_progress { background: #fce4ec; color: #c62828; }
|
||||
.status-completed { background: #f3e5f5; color: #6a1b9a; }
|
||||
.status-cancelled { background: #f5f5f5; color: #999; }
|
||||
.card-body { margin-bottom: 12rpx; }
|
||||
.card-summary { font-size: 26rpx; color: #666; display: block; }
|
||||
.card-time { font-size: 24rpx; color: #999; margin-top: 8rpx; display: block; }
|
||||
.card-footer { display: flex; justify-content: space-between; align-items: center; }
|
||||
.card-date { font-size: 24rpx; color: #bbb; }
|
||||
.arrow { font-size: 28rpx; color: #ccc; }
|
||||
.container { padding:24rpx; }
|
||||
.empty { text-align:center; padding:80rpx 0; color:var(--color-text-tertiary); }
|
||||
.go-btn { margin-top:24rpx; background:var(--color-primary-solid); color:var(--color-text-inverse); border-radius:44rpx; font-size:28rpx; }
|
||||
.card { background:var(--color-bg-card); border-radius:16rpx; padding:24rpx; margin-bottom:20rpx; box-shadow:0 2rpx 8rpx rgba(0,0,0,0.05); }
|
||||
.card-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:12rpx; }
|
||||
.card-title { font-size:32rpx; font-weight:bold; color:var(--color-text-primary); }
|
||||
.card-status { font-size:24rpx; padding:4rpx 16rpx; border-radius:20rpx; }
|
||||
.status-pending { background:var(--color-warning-light); color:var(--color-warning-strong); }
|
||||
.status-assigned { background:var(--color-info-light); color:var(--color-info-strong); }
|
||||
.status-scheduled { background:var(--color-success-light); color:var(--color-success-strong); }
|
||||
.status-in_progress { background:var(--color-primary-light); color:var(--color-danger-strong); }
|
||||
.status-completed { background:var(--color-accent-purple-light); color:var(--color-accent-purple-strong); }
|
||||
.status-cancelled { background:var(--color-bg-subtle); color:var(--color-text-tertiary); }
|
||||
.card-body { margin-bottom:12rpx; }
|
||||
.card-summary { font-size:26rpx; color:var(--color-text-secondary); display:block; }
|
||||
.card-time { font-size:24rpx; color:var(--color-text-tertiary); margin-top:8rpx; display:block; }
|
||||
.card-footer { display:flex; justify-content:space-between; align-items:center; }
|
||||
.card-date { font-size:24rpx; color:var(--color-text-disabled); }
|
||||
.arrow { font-size:28rpx; color:var(--color-text-disabled); }
|
||||
|
||||
@@ -1,94 +1,94 @@
|
||||
.page {
|
||||
padding: 32rpx;
|
||||
background: #FFF8F7;
|
||||
min-height: 100vh;
|
||||
padding:32rpx;
|
||||
background:var(--color-primary-lighter);
|
||||
min-height:100vh;
|
||||
}
|
||||
|
||||
.header {
|
||||
text-align: center;
|
||||
margin-bottom: 32rpx;
|
||||
text-align:center;
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
font-size:36rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
}
|
||||
|
||||
.loading-state, .empty-state {
|
||||
text-align: center;
|
||||
padding: 100rpx 32rpx;
|
||||
color: #999;
|
||||
text-align:center;
|
||||
padding:100rpx 32rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.empty-icon {
|
||||
font-size: 80rpx;
|
||||
display: block;
|
||||
margin-bottom: 24rpx;
|
||||
font-size:80rpx;
|
||||
display:block;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.report-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:20rpx;
|
||||
}
|
||||
|
||||
.report-card {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 24rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.04);
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
padding:24rpx;
|
||||
box-shadow:0 2rpx 12rpx rgba(0,0,0,0.04);
|
||||
}
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 12rpx;
|
||||
display:flex;
|
||||
justify-content:space-between;
|
||||
align-items:center;
|
||||
margin-bottom:12rpx;
|
||||
}
|
||||
|
||||
.reason {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
font-size:28rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
}
|
||||
|
||||
.status-tag {
|
||||
font-size: 22rpx;
|
||||
padding: 4rpx 16rpx;
|
||||
border-radius: 12rpx;
|
||||
background: #FFF3F2;
|
||||
color: #E96B6B;
|
||||
font-size:24rpx;
|
||||
padding:4rpx 16rpx;
|
||||
border-radius:12rpx;
|
||||
background:var(--color-primary-light);
|
||||
color:var(--color-primary-strong);
|
||||
}
|
||||
|
||||
.desc {
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
display: block;
|
||||
margin-bottom: 12rpx;
|
||||
line-height: 1.5;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-secondary);
|
||||
display:block;
|
||||
margin-bottom:12rpx;
|
||||
line-height:1.5;
|
||||
}
|
||||
|
||||
.time {
|
||||
font-size: 22rpx;
|
||||
color: #BBB;
|
||||
display: block;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-disabled);
|
||||
display:block;
|
||||
}
|
||||
|
||||
.result {
|
||||
font-size: 24rpx;
|
||||
color: #E59A32;
|
||||
display: block;
|
||||
margin-top: 8rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-warning-strong);
|
||||
display:block;
|
||||
margin-top:8rpx;
|
||||
}
|
||||
|
||||
.btn-refresh {
|
||||
margin-top: 32rpx;
|
||||
background: transparent;
|
||||
color: #999;
|
||||
border: 1rpx solid #DDD;
|
||||
border-radius: 44rpx;
|
||||
height: 72rpx;
|
||||
line-height: 72rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
margin-top:32rpx;
|
||||
background:transparent;
|
||||
color:var(--color-text-tertiary);
|
||||
border:1rpx solid var(--color-border-strong);
|
||||
border-radius:44rpx;
|
||||
min-height:var(--tap-min);
|
||||
line-height:var(--tap-min);
|
||||
font-size:26rpx;
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
@@ -1,127 +1,127 @@
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #FFF8F7;
|
||||
min-height:100vh;
|
||||
background:var(--color-primary-lighter);
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 32rpx;
|
||||
background: #fff;
|
||||
border-bottom: 1rpx solid #f0f0f0;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
padding:32rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-bottom:1rpx solid var(--color-divider);
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
font-size:36rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
}
|
||||
|
||||
.unread-badge {
|
||||
font-size: 24rpx;
|
||||
color: #E96B6B;
|
||||
padding: 8rpx 16rpx;
|
||||
background: #FFF3F2;
|
||||
border-radius: 20rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-primary-strong);
|
||||
padding:8rpx 16rpx;
|
||||
background:var(--color-primary-light);
|
||||
border-radius:20rpx;
|
||||
}
|
||||
|
||||
.unread-badge.empty {
|
||||
color: #999;
|
||||
background: #f5f5f5;
|
||||
color:var(--color-text-tertiary);
|
||||
background:var(--color-bg-subtle);
|
||||
}
|
||||
|
||||
.list {
|
||||
height: calc(100vh - 120rpx);
|
||||
height:calc(100vh - 120rpx);
|
||||
}
|
||||
|
||||
.notif-item {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
padding: 28rpx 32rpx;
|
||||
background: #fff;
|
||||
border-bottom: 1rpx solid #f5f5f5;
|
||||
gap: 16rpx;
|
||||
display:flex;
|
||||
align-items:flex-start;
|
||||
padding:28rpx 32rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-bottom:1rpx solid var(--color-divider);
|
||||
gap:16rpx;
|
||||
}
|
||||
|
||||
.notif-item.unread {
|
||||
background: #FFFAF9;
|
||||
background:var(--color-primary-lighter);
|
||||
}
|
||||
|
||||
.notif-dot {
|
||||
width: 12rpx;
|
||||
height: 12rpx;
|
||||
border-radius: 50%;
|
||||
background: #E96B6B;
|
||||
flex-shrink: 0;
|
||||
margin-top: 12rpx;
|
||||
width:12rpx;
|
||||
height:12rpx;
|
||||
border-radius:50%;
|
||||
background:var(--color-primary);
|
||||
flex-shrink:0;
|
||||
margin-top:12rpx;
|
||||
}
|
||||
|
||||
.notif-content {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
flex:1;
|
||||
min-width:0;
|
||||
}
|
||||
|
||||
.notif-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 8rpx;
|
||||
display:flex;
|
||||
justify-content:space-between;
|
||||
align-items:center;
|
||||
margin-bottom:8rpx;
|
||||
}
|
||||
|
||||
.notif-title {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
font-size:28rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
}
|
||||
|
||||
.notif-time {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.notif-body {
|
||||
font-size: 24rpx;
|
||||
color: #666;
|
||||
line-height: 1.6;
|
||||
margin-bottom: 12rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-secondary);
|
||||
line-height:1.6;
|
||||
margin-bottom:12rpx;
|
||||
}
|
||||
|
||||
.notif-type-tag {
|
||||
display: inline-block;
|
||||
font-size: 20rpx;
|
||||
padding: 4rpx 12rpx;
|
||||
border-radius: 12rpx;
|
||||
background: #F5F5F5;
|
||||
color: #999;
|
||||
display:inline-block;
|
||||
font-size:24rpx;
|
||||
padding:4rpx 12rpx;
|
||||
border-radius:12rpx;
|
||||
background:var(--color-bg-subtle);
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.notif-type-tag.match { background: #E8F5E9; color: #2E7D32; }
|
||||
.notif-type-tag.review { background: #E3F2FD; color: #1565C0; }
|
||||
.notif-type-tag.activity { background: #FFF3E0; color: #E65100; }
|
||||
.notif-type-tag.risk { background: #FFEBEE; color: #C62828; }
|
||||
.notif-type-tag.account { background: #F3E5F5; color: #6A1B9A; }
|
||||
.notif-type-tag.match { background:var(--color-success-light); color:var(--color-success-strong); }
|
||||
.notif-type-tag.review { background:var(--color-info-light); color:var(--color-info-strong); }
|
||||
.notif-type-tag.activity { background:var(--color-warning-light); color:var(--color-warning-strong); }
|
||||
.notif-type-tag.risk { background:var(--color-primary-light); color:var(--color-danger-strong); }
|
||||
.notif-type-tag.account { background:var(--color-accent-purple-light); color:var(--color-accent-purple-strong); }
|
||||
|
||||
.empty {
|
||||
text-align: center;
|
||||
padding: 120rpx 40rpx;
|
||||
text-align:center;
|
||||
padding:120rpx 40rpx;
|
||||
}
|
||||
|
||||
.empty-img {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
margin-bottom: 24rpx;
|
||||
opacity: 0.5;
|
||||
width:160rpx;
|
||||
height:160rpx;
|
||||
margin-bottom:24rpx;
|
||||
opacity:0.5;
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
display:block;
|
||||
font-size:28rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.loading {
|
||||
text-align: center;
|
||||
padding: 40rpx;
|
||||
color: #999;
|
||||
text-align:center;
|
||||
padding:40rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
.container { padding: 24rpx; }
|
||||
.form-section { background: #fff; border-radius: 16rpx; padding: 24rpx; }
|
||||
.form-group { padding: 20rpx 0; border-bottom: 1rpx solid #f5f5f5; }
|
||||
.form-group:last-child { border-bottom: none; }
|
||||
.label { font-size: 28rpx; color: #666; display: block; margin-bottom: 12rpx; }
|
||||
.input { font-size: 30rpx; color: #333; }
|
||||
.textarea { font-size: 30rpx; color: #333; width: 100%; height: 120rpx; }
|
||||
.switch-hint { font-size: 24rpx; color: #FF6B6B; margin-left: 12rpx; }
|
||||
.submit-btn { margin-top: 40rpx; background: linear-gradient(135deg, #FF6B6B, #EE5A24); color: #fff; border: none; border-radius: 44rpx; font-size: 32rpx; }
|
||||
.tip { display: block; text-align: center; font-size: 24rpx; color: #999; margin-top: 20rpx; }
|
||||
.container { padding:24rpx; }
|
||||
.form-section { background:var(--color-bg-card); border-radius:16rpx; padding:24rpx; }
|
||||
.form-group { padding:20rpx 0; border-bottom:1rpx solid var(--color-divider); }
|
||||
.form-group:last-child { border-bottom:none; }
|
||||
.label { font-size:28rpx; color:var(--color-text-secondary); display:block; margin-bottom:12rpx; }
|
||||
.input { font-size:30rpx; color:var(--color-text-primary); }
|
||||
.textarea { font-size:30rpx; color:var(--color-text-primary); width:100%; height:120rpx; }
|
||||
.switch-hint { font-size:24rpx; color:var(--color-primary-strong); margin-left:12rpx; }
|
||||
.submit-btn { margin-top:40rpx; background:var(--gradient-brand-solid); color:var(--color-text-inverse); border:none; border-radius:44rpx; font-size:32rpx; }
|
||||
.tip { display:block; text-align:center; font-size:24rpx; color:var(--color-text-tertiary); margin-top:20rpx; }
|
||||
|
||||
@@ -1,62 +1,62 @@
|
||||
.page {
|
||||
padding: 32rpx;
|
||||
background: #FFF8F7;
|
||||
min-height: 100vh;
|
||||
padding:32rpx;
|
||||
background:var(--color-primary-lighter);
|
||||
min-height:100vh;
|
||||
}
|
||||
|
||||
.header {
|
||||
text-align: center;
|
||||
margin-bottom: 32rpx;
|
||||
text-align:center;
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
font-size:36rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
}
|
||||
|
||||
.section {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
margin-bottom: 32rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
overflow:hidden;
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.setting-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 32rpx 28rpx;
|
||||
border-bottom: 1rpx solid #f5f5f5;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
padding:32rpx 28rpx;
|
||||
border-bottom:1rpx solid var(--color-divider);
|
||||
}
|
||||
|
||||
.setting-item:last-child { border-bottom: none; }
|
||||
.setting-item:last-child { border-bottom:none; }
|
||||
|
||||
.setting-info {
|
||||
flex: 1;
|
||||
margin-right: 20rpx;
|
||||
flex:1;
|
||||
margin-right:20rpx;
|
||||
}
|
||||
|
||||
.setting-name {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
display: block;
|
||||
font-size:28rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
display:block;
|
||||
}
|
||||
|
||||
.setting-desc {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
display: block;
|
||||
margin-top: 8rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
display:block;
|
||||
margin-top:8rpx;
|
||||
}
|
||||
|
||||
.btn-save {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
border-radius: 44rpx;
|
||||
font-size: 30rpx;
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
border-radius:44rpx;
|
||||
font-size:30rpx;
|
||||
}
|
||||
|
||||
@@ -3,99 +3,99 @@
|
||||
*/
|
||||
|
||||
.pb-page {
|
||||
min-height: 100vh;
|
||||
background: var(--color-bg-page);
|
||||
padding-bottom: calc(160rpx + env(safe-area-inset-bottom));
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-page);
|
||||
padding-bottom:calc(160rpx + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
.pb-body {
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
}
|
||||
|
||||
.pb-section {
|
||||
margin-bottom: var(--spacing-3);
|
||||
margin-bottom:var(--spacing-3);
|
||||
}
|
||||
|
||||
/* ============ 只读区 ============ */
|
||||
.pb-readonly {
|
||||
margin-top: var(--spacing-2);
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
.pb-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: var(--spacing-3) 0;
|
||||
border-bottom: var(--border-width) solid var(--color-divider);
|
||||
display:flex;
|
||||
justify-content:space-between;
|
||||
align-items:center;
|
||||
padding:var(--spacing-3) 0;
|
||||
border-bottom:var(--border-width) solid var(--color-divider);
|
||||
}
|
||||
|
||||
.pb-row:last-child {
|
||||
border-bottom: none;
|
||||
border-bottom:none;
|
||||
}
|
||||
|
||||
.pb-row__label {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-tertiary);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.pb-row__value {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
font-weight: var(--font-weight-medium);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
font-weight:var(--font-weight-medium);
|
||||
}
|
||||
|
||||
/* ============ 表单 ============ */
|
||||
.pb-form {
|
||||
margin-top: var(--spacing-2);
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
.pb-field {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: var(--spacing-3) 0;
|
||||
border-bottom: var(--border-width) solid var(--color-divider);
|
||||
min-height: 88rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
padding:var(--spacing-3) 0;
|
||||
border-bottom:var(--border-width) solid var(--color-divider);
|
||||
min-height:88rpx;
|
||||
}
|
||||
|
||||
.pb-field:last-child {
|
||||
border-bottom: none;
|
||||
border-bottom:none;
|
||||
}
|
||||
|
||||
.pb-field__label {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
flex-shrink: 0;
|
||||
width: 180rpx;
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
flex-shrink:0;
|
||||
width:180rpx;
|
||||
}
|
||||
|
||||
.pb-field__value {
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
flex:1;
|
||||
text-align:right;
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
}
|
||||
|
||||
.pb-field__value--placeholder {
|
||||
color: var(--color-text-placeholder);
|
||||
color:var(--color-text-placeholder);
|
||||
}
|
||||
|
||||
.pb-field__input {
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
flex:1;
|
||||
text-align:right;
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
}
|
||||
|
||||
/* ============ 底部 ============ */
|
||||
.pb-actions {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom: calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background: var(--color-bg-card);
|
||||
border-top: var(--border-width) solid var(--color-divider);
|
||||
z-index: var(--z-sticky);
|
||||
position:fixed;
|
||||
bottom:0;
|
||||
left:0;
|
||||
right:0;
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom:calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background:var(--color-bg-card);
|
||||
border-top:var(--border-width) solid var(--color-divider);
|
||||
z-index:var(--z-sticky);
|
||||
}
|
||||
|
||||
@@ -3,170 +3,170 @@
|
||||
*/
|
||||
|
||||
.pcfm-page {
|
||||
min-height: 100vh;
|
||||
background: var(--color-bg-page);
|
||||
padding-bottom: calc(160rpx + env(safe-area-inset-bottom));
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-page);
|
||||
padding-bottom:calc(160rpx + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
.pcfm-loading,
|
||||
.pcfm-empty {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: 60vh;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
min-height:60vh;
|
||||
}
|
||||
|
||||
.pcfm-body {
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
}
|
||||
|
||||
/* 卡片基类继承全局 .card-base(仅补充外边距) */
|
||||
.pcfm-section,
|
||||
.pcfm-status {
|
||||
margin-bottom: var(--spacing-3);
|
||||
margin-bottom:var(--spacing-3);
|
||||
}
|
||||
|
||||
/* ============ 审核状态条 ============ */
|
||||
.pcfm-status__row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: var(--spacing-2);
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
gap:var(--spacing-2);
|
||||
}
|
||||
|
||||
.pcfm-status__label {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
font-weight: var(--font-weight-medium);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
font-weight:var(--font-weight-medium);
|
||||
}
|
||||
|
||||
.pcfm-status__comment {
|
||||
margin-top: var(--spacing-2);
|
||||
padding-top: var(--spacing-2);
|
||||
border-top: var(--border-width) solid var(--color-divider);
|
||||
margin-top:var(--spacing-2);
|
||||
padding-top:var(--spacing-2);
|
||||
border-top:var(--border-width) solid var(--color-divider);
|
||||
}
|
||||
|
||||
.pcfm-status__comment-title {
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-secondary);
|
||||
display: block;
|
||||
margin-bottom: var(--spacing-1);
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-text-secondary);
|
||||
display:block;
|
||||
margin-bottom:var(--spacing-1);
|
||||
}
|
||||
|
||||
.pcfm-status__comment-text {
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-primary);
|
||||
line-height: 1.6;
|
||||
display: block;
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-text-primary);
|
||||
line-height:1.6;
|
||||
display:block;
|
||||
}
|
||||
|
||||
/* ============ 资料完整度 ============ */
|
||||
.pcfm-progress {
|
||||
margin-top: var(--spacing-2);
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
.pcfm-progress__track {
|
||||
height: 12rpx;
|
||||
background: var(--color-bg-disabled);
|
||||
border-radius: var(--radius-full);
|
||||
overflow: hidden;
|
||||
height:12rpx;
|
||||
background:var(--color-bg-disabled);
|
||||
border-radius:var(--radius-full);
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.pcfm-progress__fill {
|
||||
height: 100%;
|
||||
background: var(--color-primary);
|
||||
border-radius: var(--radius-full);
|
||||
transition: width 0.3s ease;
|
||||
height:100%;
|
||||
background:var(--color-primary);
|
||||
border-radius:var(--radius-full);
|
||||
transition:width 0.3s ease;
|
||||
}
|
||||
|
||||
.pcfm-progress__hint {
|
||||
display: block;
|
||||
margin-top: var(--spacing-2);
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-tertiary);
|
||||
text-align: right;
|
||||
display:block;
|
||||
margin-top:var(--spacing-2);
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-text-tertiary);
|
||||
text-align:right;
|
||||
}
|
||||
|
||||
/* ============ 资料概览 ============ */
|
||||
.pcfm-summary {
|
||||
margin-top: var(--spacing-2);
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
.pcfm-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: var(--spacing-3);
|
||||
padding: var(--spacing-3) 0;
|
||||
border-bottom: var(--border-width) solid var(--color-divider);
|
||||
min-height: 88rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
gap:var(--spacing-3);
|
||||
padding:var(--spacing-3) 0;
|
||||
border-bottom:var(--border-width) solid var(--color-divider);
|
||||
min-height:88rpx;
|
||||
}
|
||||
|
||||
.pcfm-info:last-child {
|
||||
border-bottom: none;
|
||||
border-bottom:none;
|
||||
}
|
||||
|
||||
.pcfm-info__label {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-secondary);
|
||||
flex-shrink: 0;
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-secondary);
|
||||
flex-shrink:0;
|
||||
}
|
||||
|
||||
.pcfm-info__value {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
text-align: right;
|
||||
word-break: break-all;
|
||||
flex: 1;
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
text-align:right;
|
||||
word-break:break-all;
|
||||
flex:1;
|
||||
}
|
||||
|
||||
/* ============ 自我介绍 ============ */
|
||||
.pcfm-intro {
|
||||
margin-top: var(--spacing-2);
|
||||
padding: var(--spacing-2) var(--spacing-3);
|
||||
background: var(--color-bg-page);
|
||||
border-radius: var(--radius-md);
|
||||
margin-top:var(--spacing-2);
|
||||
padding:var(--spacing-2) var(--spacing-3);
|
||||
background:var(--color-bg-page);
|
||||
border-radius:var(--radius-md);
|
||||
}
|
||||
|
||||
.pcfm-intro__text {
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-primary);
|
||||
line-height: 1.7;
|
||||
display: block;
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-text-primary);
|
||||
line-height:1.7;
|
||||
display:block;
|
||||
}
|
||||
|
||||
/* ============ 择偶条件摘要 ============ */
|
||||
.pcfm-pref {
|
||||
margin-top: var(--spacing-2);
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
/* ============ 提交须知 ============ */
|
||||
.pcfm-notice {
|
||||
background: var(--color-primary-light);
|
||||
border-radius: var(--radius-lg);
|
||||
padding: var(--spacing-3) var(--spacing-4);
|
||||
background:var(--color-primary-light);
|
||||
border-radius:var(--radius-lg);
|
||||
padding:var(--spacing-3) var(--spacing-4);
|
||||
}
|
||||
|
||||
.pcfm-notice__list {
|
||||
margin-top: var(--spacing-2);
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
.pcfm-notice__item {
|
||||
display: block;
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-secondary);
|
||||
line-height: 2;
|
||||
display:block;
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-text-secondary);
|
||||
line-height:2;
|
||||
}
|
||||
|
||||
/* ============ 底部按钮 ============ */
|
||||
.pcfm-actions {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom: calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background: var(--color-bg-card);
|
||||
border-top: var(--border-width) solid var(--color-divider);
|
||||
z-index: var(--z-sticky);
|
||||
position:fixed;
|
||||
bottom:0;
|
||||
left:0;
|
||||
right:0;
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom:calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background:var(--color-bg-card);
|
||||
border-top:var(--border-width) solid var(--color-divider);
|
||||
z-index:var(--z-sticky);
|
||||
}
|
||||
|
||||
@@ -4,136 +4,136 @@
|
||||
*/
|
||||
|
||||
.profile-page {
|
||||
min-height: 100vh;
|
||||
background: var(--color-bg-page);
|
||||
padding-bottom: calc(160rpx + env(safe-area-inset-bottom));
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-page);
|
||||
padding-bottom:calc(160rpx + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
/* ============ 加载/空状态 ============ */
|
||||
.profile-loading,
|
||||
.profile-empty {
|
||||
padding-top: 200rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-top:200rpx;
|
||||
display:flex;
|
||||
justify-content:center;
|
||||
}
|
||||
|
||||
/* ============ 顶部信息 ============ */
|
||||
.profile-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--spacing-4);
|
||||
padding: var(--spacing-5) var(--spacing-page-x);
|
||||
background: var(--color-bg-card);
|
||||
display:flex;
|
||||
align-items:center;
|
||||
gap:var(--spacing-4);
|
||||
padding:var(--spacing-5) var(--spacing-page-x);
|
||||
background:var(--color-bg-card);
|
||||
}
|
||||
|
||||
.profile-header__info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
flex:1;
|
||||
min-width:0;
|
||||
}
|
||||
|
||||
.profile-header__name-row {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
gap: var(--spacing-2);
|
||||
margin-bottom: var(--spacing-1);
|
||||
display:flex;
|
||||
align-items:baseline;
|
||||
gap:var(--spacing-2);
|
||||
margin-bottom:var(--spacing-1);
|
||||
}
|
||||
|
||||
.profile-header__name {
|
||||
font-size: var(--font-size-lg);
|
||||
font-weight: var(--font-weight-bold);
|
||||
color: var(--color-text-primary);
|
||||
font-size:var(--font-size-lg);
|
||||
font-weight:var(--font-weight-bold);
|
||||
color:var(--color-text-primary);
|
||||
}
|
||||
|
||||
.profile-header__age {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-tertiary);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.profile-header__meta {
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-tertiary);
|
||||
line-height: var(--line-height-normal);
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-text-tertiary);
|
||||
line-height:var(--line-height-normal);
|
||||
}
|
||||
|
||||
.profile-header__badges {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: var(--spacing-1);
|
||||
margin-top: var(--spacing-2);
|
||||
display:flex;
|
||||
flex-wrap:wrap;
|
||||
gap:var(--spacing-1);
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
/* ============ 内容区块 ============ */
|
||||
.profile-body {
|
||||
padding-top: var(--spacing-2);
|
||||
padding-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
.profile-section {
|
||||
background: var(--color-bg-card);
|
||||
margin: var(--spacing-2) var(--spacing-page-x);
|
||||
border-radius: var(--radius-lg);
|
||||
padding: var(--spacing-card-inner);
|
||||
background:var(--color-bg-card);
|
||||
margin:var(--spacing-2) var(--spacing-page-x);
|
||||
border-radius:var(--radius-lg);
|
||||
padding:var(--spacing-card-inner);
|
||||
}
|
||||
|
||||
.profile-info-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: var(--spacing-3);
|
||||
display:grid;
|
||||
grid-template-columns:1fr 1fr;
|
||||
gap:var(--spacing-3);
|
||||
}
|
||||
|
||||
.profile-info-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--spacing-1);
|
||||
min-width: 0;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
gap:var(--spacing-1);
|
||||
min-width:0;
|
||||
}
|
||||
|
||||
.profile-info-item--full {
|
||||
grid-column: span 2;
|
||||
grid-column:span 2;
|
||||
}
|
||||
|
||||
.profile-info-item__label {
|
||||
font-size: var(--font-size-xs);
|
||||
color: var(--color-text-placeholder);
|
||||
font-size:var(--font-size-xs);
|
||||
color:var(--color-text-placeholder);
|
||||
}
|
||||
|
||||
.profile-info-item__value {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-secondary);
|
||||
word-break: break-all;
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-secondary);
|
||||
word-break:break-all;
|
||||
}
|
||||
|
||||
.profile-intro-text {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-secondary);
|
||||
line-height: var(--line-height-relaxed);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-secondary);
|
||||
line-height:var(--line-height-relaxed);
|
||||
}
|
||||
|
||||
/* ============ 底部操作栏 ============ */
|
||||
.profile-actions {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
gap: var(--spacing-2);
|
||||
align-items: center;
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom: calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background: var(--color-bg-card);
|
||||
border-top: var(--border-width) solid var(--color-divider);
|
||||
z-index: var(--z-sticky);
|
||||
position:fixed;
|
||||
bottom:0;
|
||||
left:0;
|
||||
right:0;
|
||||
display:flex;
|
||||
gap:var(--spacing-2);
|
||||
align-items:center;
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom:calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background:var(--color-bg-card);
|
||||
border-top:var(--border-width) solid var(--color-divider);
|
||||
z-index:var(--z-sticky);
|
||||
}
|
||||
|
||||
.profile-actions__btn {
|
||||
flex: 1;
|
||||
flex:1;
|
||||
}
|
||||
|
||||
.profile-actions__btn--block,
|
||||
.profile-actions__btn--report {
|
||||
flex: 0 0 auto;
|
||||
min-width: 140rpx;
|
||||
flex:0 0 auto;
|
||||
min-width:140rpx;
|
||||
}
|
||||
|
||||
.profile-actions__btn--report {
|
||||
color: var(--color-warning);
|
||||
color:var(--color-warning-strong);
|
||||
}
|
||||
|
||||
@@ -3,80 +3,80 @@
|
||||
*/
|
||||
|
||||
.pt-page {
|
||||
min-height: 100vh;
|
||||
background: var(--color-bg-page);
|
||||
padding-bottom: calc(160rpx + env(safe-area-inset-bottom));
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-page);
|
||||
padding-bottom:calc(160rpx + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
.pt-body {
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
}
|
||||
|
||||
.pt-section {
|
||||
margin-bottom: var(--spacing-3);
|
||||
margin-bottom:var(--spacing-3);
|
||||
}
|
||||
|
||||
.pt-form {
|
||||
margin-top: var(--spacing-2);
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
.pt-field {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: var(--spacing-3) 0;
|
||||
border-bottom: var(--border-width) solid var(--color-divider);
|
||||
min-height: 88rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
padding:var(--spacing-3) 0;
|
||||
border-bottom:var(--border-width) solid var(--color-divider);
|
||||
min-height:88rpx;
|
||||
}
|
||||
|
||||
.pt-field:last-child {
|
||||
border-bottom: none;
|
||||
border-bottom:none;
|
||||
}
|
||||
|
||||
.pt-field--column {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
flex-direction:column;
|
||||
align-items:flex-start;
|
||||
}
|
||||
|
||||
.pt-field__label {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
flex-shrink: 0;
|
||||
width: 280rpx;
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
flex-shrink:0;
|
||||
width:280rpx;
|
||||
}
|
||||
|
||||
.pt-field--column .pt-field__label {
|
||||
width: auto;
|
||||
margin-bottom: var(--spacing-2);
|
||||
width:auto;
|
||||
margin-bottom:var(--spacing-2);
|
||||
}
|
||||
|
||||
.pt-field__value {
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
flex:1;
|
||||
text-align:right;
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
}
|
||||
|
||||
.pt-field__value--placeholder {
|
||||
color: var(--color-text-placeholder);
|
||||
color:var(--color-text-placeholder);
|
||||
}
|
||||
|
||||
.pt-field__textarea {
|
||||
width: 100%;
|
||||
min-height: 120rpx;
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-secondary);
|
||||
line-height: var(--line-height-relaxed);
|
||||
width:100%;
|
||||
min-height:120rpx;
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-secondary);
|
||||
line-height:var(--line-height-relaxed);
|
||||
}
|
||||
|
||||
.pt-actions {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom: calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background: var(--color-bg-card);
|
||||
border-top: var(--border-width) solid var(--color-divider);
|
||||
z-index: var(--z-sticky);
|
||||
position:fixed;
|
||||
bottom:0;
|
||||
left:0;
|
||||
right:0;
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom:calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background:var(--color-bg-card);
|
||||
border-top:var(--border-width) solid var(--color-divider);
|
||||
z-index:var(--z-sticky);
|
||||
}
|
||||
|
||||
@@ -3,51 +3,51 @@
|
||||
*/
|
||||
|
||||
.pi-page {
|
||||
min-height: 100vh;
|
||||
background: var(--color-bg-page);
|
||||
padding-bottom: calc(160rpx + env(safe-area-inset-bottom));
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-page);
|
||||
padding-bottom:calc(160rpx + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
.pi-body {
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
}
|
||||
|
||||
.pi-section {
|
||||
margin-bottom: var(--spacing-3);
|
||||
margin-bottom:var(--spacing-3);
|
||||
}
|
||||
|
||||
/* ============ 标签 ============ */
|
||||
.pi-tags {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: var(--spacing-2);
|
||||
margin-top: var(--spacing-3);
|
||||
display:flex;
|
||||
flex-wrap:wrap;
|
||||
gap:var(--spacing-2);
|
||||
margin-top:var(--spacing-3);
|
||||
}
|
||||
|
||||
.pi-tag {
|
||||
padding: var(--spacing-2) var(--spacing-4);
|
||||
border-radius: var(--radius-lg);
|
||||
background: var(--color-bg-disabled);
|
||||
color: var(--color-text-secondary);
|
||||
font-size: var(--font-size-sm);
|
||||
transition: all var(--button-press-feedback) ease;
|
||||
padding:var(--spacing-2) var(--spacing-4);
|
||||
border-radius:var(--radius-lg);
|
||||
background:var(--color-bg-disabled);
|
||||
color:var(--color-text-secondary);
|
||||
font-size:var(--font-size-sm);
|
||||
transition:all var(--motion-normal) var(--ease-standard);
|
||||
}
|
||||
|
||||
.pi-tag--selected {
|
||||
background: var(--color-primary);
|
||||
color: var(--color-text-inverse);
|
||||
font-weight: var(--font-weight-medium);
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
font-weight:var(--font-weight-medium);
|
||||
}
|
||||
|
||||
/* ============ 底部 ============ */
|
||||
.pi-actions {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom: calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background: var(--color-bg-card);
|
||||
border-top: var(--border-width) solid var(--color-divider);
|
||||
z-index: var(--z-sticky);
|
||||
position:fixed;
|
||||
bottom:0;
|
||||
left:0;
|
||||
right:0;
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom:calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background:var(--color-bg-card);
|
||||
border-top:var(--border-width) solid var(--color-divider);
|
||||
z-index:var(--z-sticky);
|
||||
}
|
||||
|
||||
@@ -3,91 +3,91 @@
|
||||
*/
|
||||
|
||||
.pri-page {
|
||||
min-height: 100vh;
|
||||
background: var(--color-bg-page);
|
||||
padding-bottom: calc(160rpx + env(safe-area-inset-bottom));
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-page);
|
||||
padding-bottom:calc(160rpx + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
.pri-body {
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
}
|
||||
|
||||
.pri-section {
|
||||
margin-bottom: var(--spacing-3);
|
||||
margin-bottom:var(--spacing-3);
|
||||
}
|
||||
|
||||
/* ============ 文本框 ============ */
|
||||
.pri-textarea-wrap {
|
||||
margin-top: var(--spacing-2);
|
||||
position: relative;
|
||||
margin-top:var(--spacing-2);
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.pri-textarea {
|
||||
width: 100%;
|
||||
min-height: 320rpx;
|
||||
padding: var(--spacing-3);
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
line-height: var(--line-height-relaxed);
|
||||
background: var(--color-bg-input);
|
||||
border-radius: var(--radius-md);
|
||||
box-sizing: border-box;
|
||||
width:100%;
|
||||
min-height:320rpx;
|
||||
padding:var(--spacing-3);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
line-height:var(--line-height-relaxed);
|
||||
background:var(--color-bg-input);
|
||||
border-radius:var(--radius-md);
|
||||
box-sizing:border-box;
|
||||
}
|
||||
|
||||
.pri-textarea__placeholder {
|
||||
color: var(--color-text-placeholder);
|
||||
font-size: var(--font-size-sm);
|
||||
color:var(--color-text-placeholder);
|
||||
font-size:var(--font-size-sm);
|
||||
}
|
||||
|
||||
.pri-counter {
|
||||
position: absolute;
|
||||
right: var(--spacing-2);
|
||||
bottom: var(--spacing-2);
|
||||
font-size: var(--font-size-xs);
|
||||
color: var(--color-text-placeholder);
|
||||
position:absolute;
|
||||
right:var(--spacing-2);
|
||||
bottom:var(--spacing-2);
|
||||
font-size:var(--font-size-xs);
|
||||
color:var(--color-text-placeholder);
|
||||
}
|
||||
|
||||
.pri-counter--over {
|
||||
color: var(--color-danger);
|
||||
color:var(--color-danger-strong);
|
||||
}
|
||||
|
||||
/* ============ 须知 ============ */
|
||||
.pri-guidelines {
|
||||
margin-top: var(--spacing-2);
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
.pri-guideline {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: var(--spacing-2);
|
||||
padding: var(--spacing-1) 0;
|
||||
display:flex;
|
||||
align-items:flex-start;
|
||||
gap:var(--spacing-2);
|
||||
padding:var(--spacing-1) 0;
|
||||
}
|
||||
|
||||
.pri-guideline__dot {
|
||||
width: 10rpx;
|
||||
height: 10rpx;
|
||||
margin-top: 14rpx;
|
||||
border-radius: 50%;
|
||||
background: var(--color-text-placeholder);
|
||||
flex-shrink: 0;
|
||||
width:10rpx;
|
||||
height:10rpx;
|
||||
margin-top:14rpx;
|
||||
border-radius:50%;
|
||||
background:var(--color-text-placeholder);
|
||||
flex-shrink:0;
|
||||
}
|
||||
|
||||
.pri-guideline__text {
|
||||
flex: 1;
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-tertiary);
|
||||
line-height: var(--line-height-relaxed);
|
||||
flex:1;
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-text-tertiary);
|
||||
line-height:var(--line-height-relaxed);
|
||||
}
|
||||
|
||||
/* ============ 底部 ============ */
|
||||
.pri-actions {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom: calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background: var(--color-bg-card);
|
||||
border-top: var(--border-width) solid var(--color-divider);
|
||||
z-index: var(--z-sticky);
|
||||
position:fixed;
|
||||
bottom:0;
|
||||
left:0;
|
||||
right:0;
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom:calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background:var(--color-bg-card);
|
||||
border-top:var(--border-width) solid var(--color-divider);
|
||||
z-index:var(--z-sticky);
|
||||
}
|
||||
|
||||
@@ -3,62 +3,62 @@
|
||||
*/
|
||||
|
||||
.pl-page {
|
||||
min-height: 100vh;
|
||||
background: var(--color-bg-page);
|
||||
padding-bottom: calc(160rpx + env(safe-area-inset-bottom));
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-page);
|
||||
padding-bottom:calc(160rpx + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
.pl-body {
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
}
|
||||
|
||||
.pl-section {
|
||||
margin-bottom: var(--spacing-3);
|
||||
margin-bottom:var(--spacing-3);
|
||||
}
|
||||
|
||||
.pl-form {
|
||||
margin-top: var(--spacing-2);
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
.pl-field {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: var(--spacing-3) 0;
|
||||
border-bottom: var(--border-width) solid var(--color-divider);
|
||||
min-height: 88rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
padding:var(--spacing-3) 0;
|
||||
border-bottom:var(--border-width) solid var(--color-divider);
|
||||
min-height:88rpx;
|
||||
}
|
||||
|
||||
.pl-field:last-child {
|
||||
border-bottom: none;
|
||||
border-bottom:none;
|
||||
}
|
||||
|
||||
.pl-field__label {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
flex-shrink: 0;
|
||||
width: 280rpx;
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
flex-shrink:0;
|
||||
width:280rpx;
|
||||
}
|
||||
|
||||
.pl-field__value {
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
flex:1;
|
||||
text-align:right;
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
}
|
||||
|
||||
.pl-field__value--placeholder {
|
||||
color: var(--color-text-placeholder);
|
||||
color:var(--color-text-placeholder);
|
||||
}
|
||||
|
||||
.pl-actions {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom: calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background: var(--color-bg-card);
|
||||
border-top: var(--border-width) solid var(--color-divider);
|
||||
z-index: var(--z-sticky);
|
||||
position:fixed;
|
||||
bottom:0;
|
||||
left:0;
|
||||
right:0;
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom:calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background:var(--color-bg-card);
|
||||
border-top:var(--border-width) solid var(--color-divider);
|
||||
z-index:var(--z-sticky);
|
||||
}
|
||||
|
||||
@@ -3,66 +3,66 @@
|
||||
*/
|
||||
|
||||
.pp-page {
|
||||
min-height: 100vh;
|
||||
background: var(--color-bg-page);
|
||||
padding-bottom: calc(160rpx + env(safe-area-inset-bottom));
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-page);
|
||||
padding-bottom:calc(160rpx + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
.pp-loading {
|
||||
padding-top: 200rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-top:200rpx;
|
||||
display:flex;
|
||||
justify-content:center;
|
||||
}
|
||||
|
||||
.pp-body {
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
}
|
||||
|
||||
.pp-section {
|
||||
margin-bottom: var(--spacing-3);
|
||||
margin-bottom:var(--spacing-3);
|
||||
}
|
||||
|
||||
.pp-uploader {
|
||||
margin-top: var(--spacing-2);
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
/* ============ 上传须知 ============ */
|
||||
.pp-guidelines {
|
||||
margin-top: var(--spacing-2);
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
.pp-guideline {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: var(--spacing-2);
|
||||
padding: var(--spacing-1) 0;
|
||||
display:flex;
|
||||
align-items:flex-start;
|
||||
gap:var(--spacing-2);
|
||||
padding:var(--spacing-1) 0;
|
||||
}
|
||||
|
||||
.pp-guideline__dot {
|
||||
width: 10rpx;
|
||||
height: 10rpx;
|
||||
margin-top: 14rpx;
|
||||
border-radius: 50%;
|
||||
background: var(--color-text-placeholder);
|
||||
flex-shrink: 0;
|
||||
width:10rpx;
|
||||
height:10rpx;
|
||||
margin-top:14rpx;
|
||||
border-radius:50%;
|
||||
background:var(--color-text-placeholder);
|
||||
flex-shrink:0;
|
||||
}
|
||||
|
||||
.pp-guideline__text {
|
||||
flex: 1;
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-tertiary);
|
||||
line-height: var(--line-height-relaxed);
|
||||
flex:1;
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-text-tertiary);
|
||||
line-height:var(--line-height-relaxed);
|
||||
}
|
||||
|
||||
/* ============ 底部 ============ */
|
||||
.pp-actions {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom: calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background: var(--color-bg-card);
|
||||
border-top: var(--border-width) solid var(--color-divider);
|
||||
z-index: var(--z-sticky);
|
||||
position:fixed;
|
||||
bottom:0;
|
||||
left:0;
|
||||
right:0;
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom:calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background:var(--color-bg-card);
|
||||
border-top:var(--border-width) solid var(--color-divider);
|
||||
z-index:var(--z-sticky);
|
||||
}
|
||||
|
||||
@@ -3,89 +3,89 @@
|
||||
*/
|
||||
|
||||
.ppref-page {
|
||||
min-height: 100vh;
|
||||
background: var(--color-bg-page);
|
||||
padding-bottom: calc(160rpx + env(safe-area-inset-bottom));
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-page);
|
||||
padding-bottom:calc(160rpx + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
.ppref-body {
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
}
|
||||
|
||||
.ppref-section {
|
||||
margin-bottom: var(--spacing-3);
|
||||
margin-bottom:var(--spacing-3);
|
||||
}
|
||||
|
||||
/* ============ 标签 ============ */
|
||||
.ppref-tags {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: var(--spacing-2);
|
||||
margin-top: var(--spacing-3);
|
||||
display:flex;
|
||||
flex-wrap:wrap;
|
||||
gap:var(--spacing-2);
|
||||
margin-top:var(--spacing-3);
|
||||
}
|
||||
|
||||
.ppref-tag {
|
||||
padding: var(--spacing-2) var(--spacing-4);
|
||||
border-radius: var(--radius-lg);
|
||||
background: var(--color-bg-disabled);
|
||||
color: var(--color-text-secondary);
|
||||
font-size: var(--font-size-sm);
|
||||
padding:var(--spacing-2) var(--spacing-4);
|
||||
border-radius:var(--radius-lg);
|
||||
background:var(--color-bg-disabled);
|
||||
color:var(--color-text-secondary);
|
||||
font-size:var(--font-size-sm);
|
||||
}
|
||||
|
||||
.ppref-tag--selected {
|
||||
background: var(--color-primary);
|
||||
color: var(--color-text-inverse);
|
||||
font-weight: var(--font-weight-medium);
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
font-weight:var(--font-weight-medium);
|
||||
}
|
||||
|
||||
/* ============ picker ============ */
|
||||
.ppref-picker {
|
||||
padding: var(--spacing-3) 0;
|
||||
margin-top: var(--spacing-2);
|
||||
padding:var(--spacing-3) 0;
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
.ppref-picker__value {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
}
|
||||
|
||||
/* ============ 表单 ============ */
|
||||
.ppref-form {
|
||||
margin-top: var(--spacing-2);
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
.ppref-field {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: var(--spacing-3) 0;
|
||||
border-bottom: var(--border-width) solid var(--color-divider);
|
||||
min-height: 88rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
padding:var(--spacing-3) 0;
|
||||
border-bottom:var(--border-width) solid var(--color-divider);
|
||||
min-height:88rpx;
|
||||
}
|
||||
|
||||
.ppref-field:last-child {
|
||||
border-bottom: none;
|
||||
border-bottom:none;
|
||||
}
|
||||
|
||||
.ppref-field__label {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
}
|
||||
|
||||
.ppref-field__value {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-tertiary);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
/* ============ 底部 ============ */
|
||||
.ppref-actions {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom: calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background: var(--color-bg-card);
|
||||
border-top: var(--border-width) solid var(--color-divider);
|
||||
z-index: var(--z-sticky);
|
||||
position:fixed;
|
||||
bottom:0;
|
||||
left:0;
|
||||
right:0;
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
padding-bottom:calc(var(--spacing-2) + env(safe-area-inset-bottom));
|
||||
background:var(--color-bg-card);
|
||||
border-top:var(--border-width) solid var(--color-divider);
|
||||
z-index:var(--z-sticky);
|
||||
}
|
||||
|
||||
@@ -1,152 +1,152 @@
|
||||
/* 婚恋状态页 U25 — Design Tokens */
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #FFF8F7;
|
||||
min-height:100vh;
|
||||
background:var(--color-primary-lighter);
|
||||
}
|
||||
|
||||
.body {
|
||||
padding: 24rpx;
|
||||
box-sizing: border-box;
|
||||
padding:24rpx;
|
||||
box-sizing:border-box;
|
||||
}
|
||||
|
||||
/* 状态卡片 */
|
||||
.status-card {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 32rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
border-left: 8rpx solid #E96B6B;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
padding:32rpx;
|
||||
box-shadow:0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
border-left:8rpx solid var(--color-primary);
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.status-card--warning { border-left-color: #F5A623; }
|
||||
.status-card--info { border-left-color: #4A90D9; }
|
||||
.status-card--disabled { border-left-color: #B0B0B0; }
|
||||
.status-card--warning { border-left-color:var(--color-warning-strong); }
|
||||
.status-card--info { border-left-color:var(--color-info-strong); }
|
||||
.status-card--disabled { border-left-color:var(--color-border-strong); }
|
||||
|
||||
.status-card__head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 16rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.status-card__label {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.status-card__desc {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
line-height: 1.6;
|
||||
display:block;
|
||||
font-size:28rpx;
|
||||
color:var(--color-text-primary);
|
||||
line-height:1.6;
|
||||
}
|
||||
|
||||
/* 正在了解对象卡片 */
|
||||
.partner-card {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 24rpx 32rpx;
|
||||
margin-bottom: 24rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
padding:24rpx 32rpx;
|
||||
margin-bottom:24rpx;
|
||||
box-shadow:0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
.partner-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 16rpx;
|
||||
gap: 16rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
margin-top:16rpx;
|
||||
gap:16rpx;
|
||||
}
|
||||
|
||||
.partner-info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
flex:1;
|
||||
min-width:0;
|
||||
}
|
||||
|
||||
.partner-name {
|
||||
display: block;
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
margin-bottom: 6rpx;
|
||||
display:block;
|
||||
font-size:30rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
margin-bottom:6rpx;
|
||||
}
|
||||
|
||||
.partner-hint {
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
display:block;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
/* 操作区 */
|
||||
.actions {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 24rpx 32rpx 32rpx;
|
||||
margin-bottom: 24rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
padding:24rpx 32rpx 32rpx;
|
||||
margin-bottom:24rpx;
|
||||
box-shadow:0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
.actions button {
|
||||
margin-top: 20rpx;
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
border-radius: 44rpx;
|
||||
font-size: 30rpx;
|
||||
border: none;
|
||||
margin-top:20rpx;
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
border-radius:44rpx;
|
||||
font-size:30rpx;
|
||||
border:none;
|
||||
}
|
||||
|
||||
.actions button::after {
|
||||
border: none;
|
||||
border:none;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
}
|
||||
|
||||
.btn-outline {
|
||||
background: #FFF3F2;
|
||||
color: #E96B6B;
|
||||
border: 2rpx solid #E96B6B;
|
||||
background:var(--color-primary-light);
|
||||
color:var(--color-primary-strong);
|
||||
border:2rpx solid var(--color-primary);
|
||||
}
|
||||
|
||||
.btn-danger-outline {
|
||||
flex-shrink: 0;
|
||||
height: 64rpx;
|
||||
line-height: 60rpx;
|
||||
padding: 0 28rpx;
|
||||
border-radius: 32rpx;
|
||||
font-size: 24rpx;
|
||||
background: #fff;
|
||||
color: #E04C4C;
|
||||
border: 2rpx solid #E04C4C;
|
||||
}
|
||||
flex-shrink:0;
|
||||
min-height:var(--tap-min);
|
||||
line-height:var(--tap-min);
|
||||
padding:0 28rpx;
|
||||
border-radius:32rpx;
|
||||
font-size:24rpx;
|
||||
background:var(--color-bg-card);
|
||||
color:var(--color-danger-strong);
|
||||
border:2rpx solid var(--color-danger-strong);
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
.btn-danger-outline::after {
|
||||
border: none;
|
||||
border:none;
|
||||
}
|
||||
|
||||
.actions-tip {
|
||||
text-align: center;
|
||||
padding: 40rpx 0;
|
||||
color: #B0B0B0;
|
||||
font-size: 26rpx;
|
||||
text-align:center;
|
||||
padding:40rpx 0;
|
||||
color:var(--color-text-disabled);
|
||||
font-size:26rpx;
|
||||
}
|
||||
|
||||
/* 公益免费标识 */
|
||||
.free-badge {
|
||||
text-align: center;
|
||||
padding: 24rpx;
|
||||
margin-top: 16rpx;
|
||||
text-align:center;
|
||||
padding:24rpx;
|
||||
margin-top:16rpx;
|
||||
}
|
||||
|
||||
.free-badge text {
|
||||
display: inline-block;
|
||||
font-size: 22rpx;
|
||||
color: #1A6B3E;
|
||||
background: #E8F5E9;
|
||||
padding: 8rpx 24rpx;
|
||||
border-radius: 24rpx;
|
||||
display:inline-block;
|
||||
font-size:22rpx;
|
||||
color:var(--color-success-strong);
|
||||
background:var(--color-success-light);
|
||||
padding:8rpx 24rpx;
|
||||
border-radius:24rpx;
|
||||
}
|
||||
|
||||
+128
-128
@@ -1,212 +1,212 @@
|
||||
/* 举报页 U26 — Design Tokens */
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #FFF8F7;
|
||||
min-height:100vh;
|
||||
background:var(--color-primary-lighter);
|
||||
}
|
||||
|
||||
.body {
|
||||
padding: 24rpx;
|
||||
box-sizing: border-box;
|
||||
padding:24rpx;
|
||||
box-sizing:border-box;
|
||||
}
|
||||
|
||||
/* 被举报人提示条 */
|
||||
.target-bar {
|
||||
background: #FFF3F2;
|
||||
border-radius: 12rpx;
|
||||
padding: 20rpx 24rpx;
|
||||
margin-bottom: 24rpx;
|
||||
font-size: 26rpx;
|
||||
color: #E96B6B;
|
||||
background:var(--color-primary-light);
|
||||
border-radius:12rpx;
|
||||
padding:20rpx 24rpx;
|
||||
margin-bottom:24rpx;
|
||||
font-size:26rpx;
|
||||
color:var(--color-primary-strong);
|
||||
}
|
||||
|
||||
/* 卡片 */
|
||||
.card {
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 24rpx 32rpx;
|
||||
margin-bottom: 24rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
background:var(--color-bg-card);
|
||||
border-radius:20rpx;
|
||||
padding:24rpx 32rpx;
|
||||
margin-bottom:24rpx;
|
||||
box-shadow:0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
/* 举报原因网格 */
|
||||
.reason-grid {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 16rpx;
|
||||
margin-top: 16rpx;
|
||||
display:flex;
|
||||
flex-wrap:wrap;
|
||||
gap:16rpx;
|
||||
margin-top:16rpx;
|
||||
}
|
||||
|
||||
.reason-item {
|
||||
flex: 0 0 calc(33.333% - 12rpx);
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
padding: 20rpx 0;
|
||||
border-radius: 12rpx;
|
||||
background: #F7F8FA;
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
border: 2rpx solid transparent;
|
||||
transition: all 0.2s;
|
||||
flex:0 0 calc(33.333% - 12rpx);
|
||||
box-sizing:border-box;
|
||||
text-align:center;
|
||||
padding:20rpx 0;
|
||||
border-radius:12rpx;
|
||||
background:var(--color-bg-subtle);
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-secondary);
|
||||
border:2rpx solid transparent;
|
||||
transition:all 0.2s;
|
||||
}
|
||||
|
||||
.reason-item.active {
|
||||
background: #FFF3F2;
|
||||
color: #E96B6B;
|
||||
border-color: #E96B6B;
|
||||
font-weight: bold;
|
||||
background:var(--color-primary-light);
|
||||
color:var(--color-primary-strong);
|
||||
border-color:var(--color-primary);
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
/* 证据截图 */
|
||||
.evidence-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 16rpx;
|
||||
margin-top: 16rpx;
|
||||
display:flex;
|
||||
flex-wrap:wrap;
|
||||
gap:16rpx;
|
||||
margin-top:16rpx;
|
||||
}
|
||||
|
||||
.evidence-item {
|
||||
position: relative;
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 12rpx;
|
||||
overflow: hidden;
|
||||
position:relative;
|
||||
width:160rpx;
|
||||
height:160rpx;
|
||||
border-radius:12rpx;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.evidence-item image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
|
||||
.remove-btn {
|
||||
position: absolute;
|
||||
top: 4rpx;
|
||||
right: 4rpx;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
line-height: 32rpx;
|
||||
text-align: center;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
color: #fff;
|
||||
border-radius: 50%;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
position:absolute;
|
||||
top:4rpx;
|
||||
right:4rpx;
|
||||
width:36rpx;
|
||||
min-height:var(--tap-min);
|
||||
line-height:var(--tap-min);
|
||||
text-align:center;
|
||||
background:rgba(0, 0, 0, 0.5);
|
||||
color:var(--color-text-inverse);
|
||||
border-radius:50%;
|
||||
font-size:24rpx;
|
||||
min-width:var(--tap-min);}
|
||||
|
||||
.evidence-add {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 12rpx;
|
||||
background: #F7F8FA;
|
||||
border: 2rpx dashed #D0D0D0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #999;
|
||||
width:160rpx;
|
||||
height:160rpx;
|
||||
border-radius:12rpx;
|
||||
background:var(--color-bg-subtle);
|
||||
border:2rpx dashed var(--color-border-strong);
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.add-icon {
|
||||
font-size: 48rpx;
|
||||
color: #B0B0B0;
|
||||
line-height: 1;
|
||||
font-size:48rpx;
|
||||
color:var(--color-text-disabled);
|
||||
line-height:1;
|
||||
}
|
||||
|
||||
.add-text {
|
||||
font-size: 22rpx;
|
||||
margin-top: 8rpx;
|
||||
font-size:24rpx;
|
||||
margin-top:8rpx;
|
||||
}
|
||||
|
||||
/* 提交按钮 */
|
||||
.btn-submit {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
border-radius: 44rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
border: none;
|
||||
margin-top: 8rpx;
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
border-radius:44rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
font-size:32rpx;
|
||||
border:none;
|
||||
margin-top:8rpx;
|
||||
}
|
||||
|
||||
.btn-submit::after {
|
||||
border: none;
|
||||
border:none;
|
||||
}
|
||||
|
||||
.btn-submit[disabled] {
|
||||
opacity: 0.5;
|
||||
opacity:0.5;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
width: 80%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
border-radius: 44rpx;
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
border: none;
|
||||
margin-top: 48rpx;
|
||||
width:80%;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
border-radius:44rpx;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
font-size:32rpx;
|
||||
border:none;
|
||||
margin-top:48rpx;
|
||||
}
|
||||
|
||||
.btn-primary::after {
|
||||
border: none;
|
||||
border:none;
|
||||
}
|
||||
|
||||
.hint {
|
||||
display: block;
|
||||
text-align: center;
|
||||
font-size: 22rpx;
|
||||
color: #B0B0B0;
|
||||
margin-top: 20rpx;
|
||||
padding: 0 24rpx;
|
||||
display:block;
|
||||
text-align:center;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-disabled);
|
||||
margin-top:20rpx;
|
||||
padding:0 24rpx;
|
||||
}
|
||||
|
||||
/* 成功态 */
|
||||
.success-wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 120rpx 48rpx;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
padding:120rpx 48rpx;
|
||||
}
|
||||
|
||||
.success-icon {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
line-height: 120rpx;
|
||||
text-align: center;
|
||||
border-radius: 50%;
|
||||
background: #E8F5E9;
|
||||
color: #1A6B3E;
|
||||
font-size: 64rpx;
|
||||
margin-bottom: 32rpx;
|
||||
width:120rpx;
|
||||
height:120rpx;
|
||||
line-height:120rpx;
|
||||
text-align:center;
|
||||
border-radius:50%;
|
||||
background:var(--color-success-light);
|
||||
color:var(--color-success-strong);
|
||||
font-size:64rpx;
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.success-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
margin-bottom: 16rpx;
|
||||
font-size:36rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.success-hint {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
text-align: center;
|
||||
line-height: 1.6;
|
||||
font-size:26rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
text-align:center;
|
||||
line-height:1.6;
|
||||
}
|
||||
|
||||
/* 公益免费标识 */
|
||||
.free-badge {
|
||||
text-align: center;
|
||||
padding: 24rpx;
|
||||
margin-top: 16rpx;
|
||||
text-align:center;
|
||||
padding:24rpx;
|
||||
margin-top:16rpx;
|
||||
}
|
||||
|
||||
.free-badge text {
|
||||
display: inline-block;
|
||||
font-size: 22rpx;
|
||||
color: #1A6B3E;
|
||||
background: #E8F5E9;
|
||||
padding: 8rpx 24rpx;
|
||||
border-radius: 24rpx;
|
||||
display:inline-block;
|
||||
font-size:22rpx;
|
||||
color:var(--color-success-strong);
|
||||
background:var(--color-success-light);
|
||||
padding:8rpx 24rpx;
|
||||
border-radius:24rpx;
|
||||
}
|
||||
|
||||
@@ -3,184 +3,184 @@
|
||||
*/
|
||||
|
||||
.rp-page {
|
||||
min-height: 100vh;
|
||||
background: var(--color-bg-page);
|
||||
padding-bottom: calc(var(--spacing-page-x) + env(safe-area-inset-bottom));
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-page);
|
||||
padding-bottom:calc(var(--spacing-page-x) + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
.rp-loading {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: 60vh;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
min-height:60vh;
|
||||
}
|
||||
|
||||
.rp-body {
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
}
|
||||
|
||||
/* ============ 顶部状态卡 ============ */
|
||||
.rp-hero {
|
||||
margin-bottom: var(--spacing-3);
|
||||
padding: var(--spacing-5) var(--spacing-4);
|
||||
text-align: center;
|
||||
margin-bottom:var(--spacing-3);
|
||||
padding:var(--spacing-5) var(--spacing-4);
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.rp-hero__icon {
|
||||
width: 96rpx;
|
||||
height: 96rpx;
|
||||
margin: 0 auto var(--spacing-3);
|
||||
border-radius: var(--radius-full);
|
||||
background: var(--color-primary-light);
|
||||
color: var(--color-primary);
|
||||
font-size: 56rpx;
|
||||
line-height: 96rpx;
|
||||
font-weight: var(--font-weight-bold);
|
||||
width:96rpx;
|
||||
height:96rpx;
|
||||
margin:0 auto var(--spacing-3);
|
||||
border-radius:var(--radius-full);
|
||||
background:var(--color-primary-light);
|
||||
color:var(--color-primary-strong);
|
||||
font-size:56rpx;
|
||||
line-height:96rpx;
|
||||
font-weight:var(--font-weight-bold);
|
||||
}
|
||||
|
||||
.rp-hero__title {
|
||||
display: block;
|
||||
font-size: var(--font-size-xl);
|
||||
color: var(--color-text-primary);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
margin-bottom: var(--spacing-2);
|
||||
display:block;
|
||||
font-size:var(--font-size-xl);
|
||||
color:var(--color-text-primary);
|
||||
font-weight:var(--font-weight-semibold);
|
||||
margin-bottom:var(--spacing-2);
|
||||
}
|
||||
|
||||
.rp-hero__desc {
|
||||
display: block;
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-secondary);
|
||||
line-height: 1.7;
|
||||
margin-bottom: var(--spacing-2);
|
||||
display:block;
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-secondary);
|
||||
line-height:1.7;
|
||||
margin-bottom:var(--spacing-2);
|
||||
}
|
||||
|
||||
.rp-hero__hint {
|
||||
display: block;
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-tertiary);
|
||||
line-height: 1.6;
|
||||
display:block;
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-text-tertiary);
|
||||
line-height:1.6;
|
||||
}
|
||||
|
||||
/* ============ 通用 section ============ */
|
||||
.rp-section {
|
||||
margin-bottom: var(--spacing-3);
|
||||
padding: var(--spacing-3) var(--spacing-4);
|
||||
margin-bottom:var(--spacing-3);
|
||||
padding:var(--spacing-3) var(--spacing-4);
|
||||
}
|
||||
|
||||
/* ============ 双状态展示 ============ */
|
||||
.rp-status-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: var(--spacing-3);
|
||||
padding: var(--spacing-3) 0;
|
||||
border-bottom: var(--border-width) solid var(--color-divider);
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
gap:var(--spacing-3);
|
||||
padding:var(--spacing-3) 0;
|
||||
border-bottom:var(--border-width) solid var(--color-divider);
|
||||
}
|
||||
|
||||
.rp-status-row:last-child {
|
||||
border-bottom: none;
|
||||
border-bottom:none;
|
||||
}
|
||||
|
||||
.rp-status-row__label {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
font-weight: var(--font-weight-medium);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
font-weight:var(--font-weight-medium);
|
||||
}
|
||||
|
||||
.rp-status-meta {
|
||||
padding-top: var(--spacing-2);
|
||||
border-top: var(--border-width) solid var(--color-divider);
|
||||
margin-top: var(--spacing-2);
|
||||
padding-top:var(--spacing-2);
|
||||
border-top:var(--border-width) solid var(--color-divider);
|
||||
margin-top:var(--spacing-2);
|
||||
}
|
||||
|
||||
.rp-status-meta__text {
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-tertiary);
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
/* ============ 审核步骤 ============ */
|
||||
.rp-steps {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: var(--spacing-2) 0;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
padding:var(--spacing-2) 0;
|
||||
}
|
||||
|
||||
.rp-step {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: var(--spacing-2);
|
||||
position: relative;
|
||||
flex:1;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
gap:var(--spacing-2);
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.rp-step:not(:last-child)::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 28rpx;
|
||||
right: -50%;
|
||||
width: 100%;
|
||||
height: 2rpx;
|
||||
background: var(--color-divider);
|
||||
content:'';
|
||||
position:absolute;
|
||||
top:28rpx;
|
||||
right:-50%;
|
||||
width:100%;
|
||||
height:2rpx;
|
||||
background:var(--color-divider);
|
||||
}
|
||||
|
||||
.rp-step--active:not(:last-child)::after {
|
||||
background: var(--color-primary);
|
||||
background:var(--color-primary);
|
||||
}
|
||||
|
||||
.rp-step__icon {
|
||||
width: 56rpx;
|
||||
height: 56rpx;
|
||||
border-radius: var(--radius-full);
|
||||
background: var(--color-bg-disabled);
|
||||
color: var(--color-text-tertiary);
|
||||
font-size: 32rpx;
|
||||
line-height: 56rpx;
|
||||
text-align: center;
|
||||
font-weight: var(--font-weight-medium);
|
||||
width:56rpx;
|
||||
height:56rpx;
|
||||
border-radius:var(--radius-full);
|
||||
background:var(--color-bg-disabled);
|
||||
color:var(--color-text-tertiary);
|
||||
font-size:32rpx;
|
||||
line-height:56rpx;
|
||||
text-align:center;
|
||||
font-weight:var(--font-weight-medium);
|
||||
}
|
||||
|
||||
.rp-step--active .rp-step__icon {
|
||||
background: var(--color-primary);
|
||||
color: var(--color-text-inverse);
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
}
|
||||
|
||||
.rp-step__label {
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-tertiary);
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.rp-step--active .rp-step__label {
|
||||
color: var(--color-text-primary);
|
||||
font-weight: var(--font-weight-medium);
|
||||
color:var(--color-text-primary);
|
||||
font-weight:var(--font-weight-medium);
|
||||
}
|
||||
|
||||
/* ============ 操作按钮 ============ */
|
||||
.rp-actions {
|
||||
margin: var(--spacing-4) 0;
|
||||
margin:var(--spacing-4) 0;
|
||||
}
|
||||
|
||||
.rp-actions__gap {
|
||||
height: var(--spacing-2);
|
||||
height:var(--spacing-2);
|
||||
}
|
||||
|
||||
/* ============ 帮助提示 ============ */
|
||||
.rp-help {
|
||||
text-align: center;
|
||||
padding: var(--spacing-3) 0;
|
||||
text-align:center;
|
||||
padding:var(--spacing-3) 0;
|
||||
}
|
||||
|
||||
.rp-help__text {
|
||||
display: block;
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-tertiary);
|
||||
margin-bottom: var(--spacing-1);
|
||||
display:block;
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-text-tertiary);
|
||||
margin-bottom:var(--spacing-1);
|
||||
}
|
||||
|
||||
.rp-help__link {
|
||||
display: inline-block;
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-primary);
|
||||
text-decoration: underline;
|
||||
display:inline-block;
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-primary-strong);
|
||||
text-decoration:underline;
|
||||
}
|
||||
|
||||
@@ -3,174 +3,174 @@
|
||||
*/
|
||||
|
||||
.rr-page {
|
||||
min-height: 100vh;
|
||||
background: var(--color-bg-page);
|
||||
padding-bottom: calc(160rpx + env(safe-area-inset-bottom));
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-page);
|
||||
padding-bottom:calc(160rpx + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
.rr-loading,
|
||||
.rr-empty {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: 60vh;
|
||||
gap: var(--spacing-4);
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
min-height:60vh;
|
||||
gap:var(--spacing-4);
|
||||
}
|
||||
|
||||
.rr-body {
|
||||
padding: var(--spacing-2) var(--spacing-page-x);
|
||||
padding:var(--spacing-2) var(--spacing-page-x);
|
||||
}
|
||||
|
||||
/* ============ 顶部提示卡 ============ */
|
||||
.rr-hero {
|
||||
margin-bottom: var(--spacing-3);
|
||||
padding: var(--spacing-5) var(--spacing-4);
|
||||
text-align: center;
|
||||
margin-bottom:var(--spacing-3);
|
||||
padding:var(--spacing-5) var(--spacing-4);
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.rr-hero__icon {
|
||||
width: 96rpx;
|
||||
height: 96rpx;
|
||||
margin: 0 auto var(--spacing-3);
|
||||
border-radius: var(--radius-full);
|
||||
background: var(--color-warning-light);
|
||||
color: var(--color-warning);
|
||||
font-size: 56rpx;
|
||||
line-height: 96rpx;
|
||||
font-weight: var(--font-weight-bold);
|
||||
width:96rpx;
|
||||
height:96rpx;
|
||||
margin:0 auto var(--spacing-3);
|
||||
border-radius:var(--radius-full);
|
||||
background:var(--color-warning-light);
|
||||
color:var(--color-warning-strong);
|
||||
font-size:56rpx;
|
||||
line-height:96rpx;
|
||||
font-weight:var(--font-weight-bold);
|
||||
}
|
||||
|
||||
.rr-hero__title {
|
||||
display: block;
|
||||
font-size: var(--font-size-xl);
|
||||
color: var(--color-text-primary);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
margin-bottom: var(--spacing-2);
|
||||
display:block;
|
||||
font-size:var(--font-size-xl);
|
||||
color:var(--color-text-primary);
|
||||
font-weight:var(--font-weight-semibold);
|
||||
margin-bottom:var(--spacing-2);
|
||||
}
|
||||
|
||||
.rr-hero__desc {
|
||||
display: block;
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-secondary);
|
||||
line-height: 1.7;
|
||||
display:block;
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-secondary);
|
||||
line-height:1.7;
|
||||
}
|
||||
|
||||
/* ============ 通用 section ============ */
|
||||
.rr-section {
|
||||
margin-bottom: var(--spacing-3);
|
||||
padding: var(--spacing-3) var(--spacing-4);
|
||||
margin-bottom:var(--spacing-3);
|
||||
padding:var(--spacing-3) var(--spacing-4);
|
||||
}
|
||||
|
||||
/* ============ 需修改项列表 ============ */
|
||||
.rr-issue {
|
||||
padding: var(--spacing-3) 0;
|
||||
border-bottom: var(--border-width) solid var(--color-divider);
|
||||
padding:var(--spacing-3) 0;
|
||||
border-bottom:var(--border-width) solid var(--color-divider);
|
||||
}
|
||||
|
||||
.rr-issue:last-child {
|
||||
border-bottom: none;
|
||||
border-bottom:none;
|
||||
}
|
||||
|
||||
.rr-issue__head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: var(--spacing-3);
|
||||
margin-bottom: var(--spacing-2);
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
gap:var(--spacing-3);
|
||||
margin-bottom:var(--spacing-2);
|
||||
}
|
||||
|
||||
.rr-issue__title {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
font-weight: var(--font-weight-medium);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
font-weight:var(--font-weight-medium);
|
||||
}
|
||||
|
||||
.rr-issue__reason {
|
||||
padding: var(--spacing-2) var(--spacing-3);
|
||||
background: var(--color-warning-light);
|
||||
border-radius: var(--radius-md);
|
||||
margin-bottom: var(--spacing-2);
|
||||
padding:var(--spacing-2) var(--spacing-3);
|
||||
background:var(--color-warning-light);
|
||||
border-radius:var(--radius-md);
|
||||
margin-bottom:var(--spacing-2);
|
||||
}
|
||||
|
||||
.rr-issue__reason-label {
|
||||
display: block;
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-warning);
|
||||
font-weight: var(--font-weight-medium);
|
||||
margin-bottom: var(--spacing-1);
|
||||
display:block;
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-warning-strong);
|
||||
font-weight:var(--font-weight-medium);
|
||||
margin-bottom:var(--spacing-1);
|
||||
}
|
||||
|
||||
.rr-issue__reason-text {
|
||||
display: block;
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-primary);
|
||||
line-height: 1.7;
|
||||
display:block;
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-text-primary);
|
||||
line-height:1.7;
|
||||
}
|
||||
|
||||
.rr-issue__action {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
display:flex;
|
||||
justify-content:flex-end;
|
||||
}
|
||||
|
||||
.rr-issue__edit-link {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-primary);
|
||||
font-weight: var(--font-weight-medium);
|
||||
padding: var(--spacing-1) var(--spacing-2);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-primary-strong);
|
||||
font-weight:var(--font-weight-medium);
|
||||
padding:var(--spacing-1) var(--spacing-2);
|
||||
}
|
||||
|
||||
/* ============ 其他审核结果 ============ */
|
||||
.rr-toggle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: var(--spacing-2) 0;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
padding:var(--spacing-2) 0;
|
||||
}
|
||||
|
||||
.rr-toggle__text {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-secondary);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-secondary);
|
||||
}
|
||||
|
||||
.rr-toggle__arrow {
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-primary);
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-primary-strong);
|
||||
}
|
||||
|
||||
.rr-other-list {
|
||||
margin-top: var(--spacing-2);
|
||||
padding-top: var(--spacing-2);
|
||||
border-top: var(--border-width) solid var(--color-divider);
|
||||
margin-top:var(--spacing-2);
|
||||
padding-top:var(--spacing-2);
|
||||
border-top:var(--border-width) solid var(--color-divider);
|
||||
}
|
||||
|
||||
.rr-other-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: var(--spacing-3);
|
||||
padding: var(--spacing-2) 0;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
gap:var(--spacing-3);
|
||||
padding:var(--spacing-2) 0;
|
||||
}
|
||||
|
||||
.rr-other-row__label {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-text-primary);
|
||||
font-size:var(--font-size-md);
|
||||
color:var(--color-text-primary);
|
||||
}
|
||||
|
||||
/* ============ 操作按钮 ============ */
|
||||
.rr-actions {
|
||||
margin: var(--spacing-4) 0;
|
||||
margin:var(--spacing-4) 0;
|
||||
}
|
||||
|
||||
/* ============ 帮助提示 ============ */
|
||||
.rr-help {
|
||||
text-align: center;
|
||||
padding: var(--spacing-3) 0;
|
||||
text-align:center;
|
||||
padding:var(--spacing-3) 0;
|
||||
}
|
||||
|
||||
.rr-help__text {
|
||||
display: block;
|
||||
font-size: var(--font-size-sm);
|
||||
color: var(--color-text-tertiary);
|
||||
line-height: 1.6;
|
||||
display:block;
|
||||
font-size:var(--font-size-sm);
|
||||
color:var(--color-text-tertiary);
|
||||
line-height:1.6;
|
||||
}
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
@import "../../styles/service-page.wxss";
|
||||
.station-name-card{display:flex;align-items:center;gap:18rpx;margin-top:24rpx;padding:24rpx;border-radius:26rpx;background:linear-gradient(135deg,#F1FFFA,#FFF7F9);box-shadow:0 8rpx 26rpx rgba(35,35,95,.06)}.station-name-card>image{width:66rpx;height:66rpx}.station-name-card>view{display:flex;flex:1;flex-direction:column}.station-name{color:#283056;font-size:27rpx;font-weight:700}.station-short-name{margin-top:6rpx;color:#7E859B;font-size:19rpx}.station-info-card{overflow:hidden;margin-top:18rpx;border-radius:26rpx;background:#fff;box-shadow:0 8rpx 26rpx rgba(35,35,95,.06)}.station-info-row{display:flex;align-items:center;gap:16rpx;min-height:104rpx;padding:14rpx 20rpx;border-bottom:1rpx solid #EFF0F5}.station-info-row:last-child{border-bottom:0}.station-info-row>image:first-child{width:42rpx;height:42rpx;flex:none}.station-info-row>view{display:flex;flex:1;flex-direction:column}.station-info-label{color:#303654;font-size:22rpx;font-weight:650}.station-info-value{margin-top:5rpx;color:#858A9E;font-size:19rpx;line-height:1.45}.station-info-row .station-arrow{width:24rpx;height:24rpx}.station-services{display:grid;grid-template-columns:repeat(2,1fr);gap:14rpx;margin-top:18rpx}.station-service{display:flex;align-items:center;gap:12rpx;min-height:74rpx;padding:12rpx 16rpx;border-radius:20rpx;background:#fff;color:#505874;font-size:20rpx;box-shadow:0 6rpx 20rpx rgba(35,35,95,.05)}.station-service image{width:34rpx;height:34rpx}.map-button{display:flex;align-items:center;justify-content:center;gap:10rpx;height:78rpx;margin-top:20rpx;border:1rpx solid #E5E7F0;border-radius:39rpx;background:#fff;color:#53607F;font-size:22rpx}.map-button image{width:34rpx;height:34rpx}
|
||||
.station-name-card{display:flex;align-items:center;gap:18rpx;margin-top:24rpx;padding:24rpx;border-radius:26rpx;background:linear-gradient(135deg,var(--color-success-light),var(--color-primary-light));box-shadow:0 8rpx 26rpx rgba(35,35,95,.06)}.station-name-card>image{width:66rpx;height:66rpx}.station-name-card>view{display:flex;flex:1;flex-direction:column}.station-name{color:var(--color-text-strong);font-size:27rpx;font-weight:700}.station-short-name{margin-top:6rpx;color:var(--color-text-tertiary);font-size:24rpx}.station-info-card{overflow:hidden;margin-top:18rpx;border-radius:26rpx;background:var(--color-bg-card);box-shadow:0 8rpx 26rpx rgba(35,35,95,.06)}.station-info-row{display:flex;align-items:center;gap:16rpx;min-height:104rpx;padding:14rpx 20rpx;border-bottom:1rpx solid var(--color-divider)}.station-info-row:last-child{border-bottom:0}.station-info-row>image:first-child{width:42rpx;height:42rpx;flex:none}.station-info-row>view{display:flex;flex:1;flex-direction:column}.station-info-label{color:var(--color-text-strong);font-size:24rpx;font-weight:600}.station-info-value{margin-top:5rpx;color:var(--color-text-tertiary);font-size:24rpx;line-height:1.45}.station-info-row .station-arrow{width:24rpx;height:24rpx}.station-services{display:grid;grid-template-columns:repeat(2,1fr);gap:14rpx;margin-top:18rpx}.station-service{display:flex;align-items:center;gap:12rpx;min-height:74rpx;padding:12rpx 16rpx;border-radius:20rpx;background:var(--color-bg-card);color:var(--color-text-secondary);font-size:24rpx;box-shadow:0 6rpx 20rpx rgba(35,35,95,.05)}.station-service image{width:34rpx;height:34rpx}.map-button{display:flex;align-items:center;justify-content:center;gap:10rpx;min-height:var(--tap-min);margin-top:20rpx;border:1rpx solid var(--color-border);border-radius:39rpx;background:var(--color-bg-card);color:var(--color-text-secondary);font-size:24rpx;min-width:var(--tap-min);}.map-button image{width:34rpx;height:34rpx}
|
||||
/* 临时公告:仅当服务端返回「已发布且未过期」公告时渲染 */
|
||||
.station-announcements{display:flex;flex-direction:column;gap:14rpx;margin-top:18rpx}
|
||||
.station-announcement{padding:18rpx 20rpx;border-radius:20rpx;background:linear-gradient(135deg,#FFF7EC,#FFF7F9);box-shadow:0 6rpx 20rpx rgba(35,35,95,.05)}
|
||||
.station-announcement{padding:18rpx 20rpx;border-radius:20rpx;background:linear-gradient(135deg,var(--color-warning-light),var(--color-primary-light));box-shadow:0 6rpx 20rpx rgba(35,35,95,.05)}
|
||||
.station-announcement-head{display:flex;align-items:center;gap:10rpx}
|
||||
.station-announcement-dot{width:12rpx;height:12rpx;flex:none;border-radius:50%;background:#E8A33D}
|
||||
.station-announcement-title{color:#5A4520;font-size:22rpx;font-weight:700}
|
||||
.station-announcement-body{display:block;margin-top:8rpx;color:#8A7C63;font-size:19rpx;line-height:1.5}
|
||||
.station-announcement-dot{width:12rpx;height:12rpx;flex:none;border-radius:50%;background:var(--color-warning)}
|
||||
.station-announcement-title{color:var(--color-warning-strong);font-size:24rpx;font-weight:700}
|
||||
.station-announcement-body{display:block;margin-top:8rpx;color:var(--color-warning-strong);font-size:24rpx;line-height:1.5}
|
||||
|
||||
@@ -1,65 +1,65 @@
|
||||
/* 设置页样式 */
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #f5f5f5;
|
||||
padding-bottom: 48rpx;
|
||||
min-height:100vh;
|
||||
background:var(--color-bg-subtle);
|
||||
padding-bottom:48rpx;
|
||||
}
|
||||
|
||||
.section {
|
||||
margin-top: 24rpx;
|
||||
background: #fff;
|
||||
margin-top:24rpx;
|
||||
background:var(--color-bg-card);
|
||||
}
|
||||
|
||||
.section-title {
|
||||
padding: 24rpx 32rpx 16rpx;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
padding:24rpx 32rpx 16rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
}
|
||||
|
||||
.list-group {
|
||||
padding: 0 32rpx;
|
||||
padding:0 32rpx;
|
||||
}
|
||||
|
||||
.list-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 28rpx 0;
|
||||
border-bottom: 1rpx solid #f5f5f5;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
padding:28rpx 0;
|
||||
border-bottom:1rpx solid var(--color-divider);
|
||||
}
|
||||
|
||||
.list-row:last-child {
|
||||
border-bottom: none;
|
||||
border-bottom:none;
|
||||
}
|
||||
|
||||
.list-icon {
|
||||
font-size: 40rpx;
|
||||
margin-right: 24rpx;
|
||||
width: 48rpx;
|
||||
text-align: center;
|
||||
font-size:40rpx;
|
||||
margin-right:24rpx;
|
||||
width:48rpx;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.list-info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
flex:1;
|
||||
min-width:0;
|
||||
}
|
||||
|
||||
.list-label {
|
||||
display: block;
|
||||
font-size: 32rpx;
|
||||
color: #2d2d2d;
|
||||
line-height: 1.4;
|
||||
display:block;
|
||||
font-size:32rpx;
|
||||
color:var(--color-text-strong);
|
||||
line-height:1.4;
|
||||
}
|
||||
|
||||
.list-desc {
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
line-height: 1.4;
|
||||
margin-top: 4rpx;
|
||||
display:block;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
line-height:1.4;
|
||||
margin-top:4rpx;
|
||||
}
|
||||
|
||||
.list-arrow {
|
||||
font-size: 32rpx;
|
||||
color: #ccc;
|
||||
margin-left: 16rpx;
|
||||
font-size:32rpx;
|
||||
color:var(--color-text-disabled);
|
||||
margin-left:16rpx;
|
||||
}
|
||||
|
||||
@@ -1,114 +1,114 @@
|
||||
.page {
|
||||
padding: 40rpx;
|
||||
min-height: 100vh;
|
||||
background: #FFF8F7;
|
||||
padding:40rpx;
|
||||
min-height:100vh;
|
||||
background:var(--color-primary-lighter);
|
||||
}
|
||||
|
||||
.header {
|
||||
margin-bottom: 48rpx;
|
||||
margin-bottom:48rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
display: block;
|
||||
font-size: 44rpx;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
margin-bottom: 16rpx;
|
||||
display:block;
|
||||
font-size:44rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-strong);
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
line-height: 1.6;
|
||||
display:block;
|
||||
font-size:28rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
line-height:1.6;
|
||||
}
|
||||
|
||||
.form {
|
||||
background: #fff;
|
||||
border-radius: 24rpx;
|
||||
padding: 40rpx;
|
||||
margin-bottom: 40rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:24rpx;
|
||||
padding:40rpx;
|
||||
margin-bottom:40rpx;
|
||||
}
|
||||
|
||||
.field {
|
||||
margin-bottom: 32rpx;
|
||||
margin-bottom:32rpx;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
margin-bottom: 16rpx;
|
||||
font-weight: 500;
|
||||
display:block;
|
||||
font-size:28rpx;
|
||||
color:var(--color-text-primary);
|
||||
margin-bottom:16rpx;
|
||||
font-weight:500;
|
||||
}
|
||||
|
||||
.input {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
border: 2rpx solid #EEE;
|
||||
border-radius: 16rpx;
|
||||
padding: 0 24rpx;
|
||||
font-size: 32rpx;
|
||||
box-sizing: border-box;
|
||||
width:100%;
|
||||
height:88rpx;
|
||||
border:2rpx solid var(--color-border);
|
||||
border-radius:16rpx;
|
||||
padding:0 24rpx;
|
||||
font-size:32rpx;
|
||||
box-sizing:border-box;
|
||||
}
|
||||
|
||||
.agreement {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 32rpx;
|
||||
font-size: 24rpx;
|
||||
color: #666;
|
||||
display:flex;
|
||||
align-items:flex-start;
|
||||
margin-bottom:32rpx;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-secondary);
|
||||
}
|
||||
|
||||
.agreement-text {
|
||||
margin-left: 12rpx;
|
||||
line-height: 1.6;
|
||||
margin-left:12rpx;
|
||||
line-height:1.6;
|
||||
}
|
||||
|
||||
.link {
|
||||
color: #E96B6B;
|
||||
color:var(--color-primary-strong);
|
||||
}
|
||||
|
||||
.error {
|
||||
background: #FFF3F2;
|
||||
color: #DC3545;
|
||||
padding: 20rpx 24rpx;
|
||||
border-radius: 12rpx;
|
||||
font-size: 26rpx;
|
||||
margin-bottom: 24rpx;
|
||||
background:var(--color-primary-light);
|
||||
color:var(--color-danger-strong);
|
||||
padding:20rpx 24rpx;
|
||||
border-radius:12rpx;
|
||||
font-size:26rpx;
|
||||
margin-bottom:24rpx;
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
background: #E96B6B;
|
||||
color: #fff;
|
||||
border-radius: 44rpx;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
background:var(--color-primary-solid);
|
||||
color:var(--color-text-inverse);
|
||||
border-radius:44rpx;
|
||||
height:88rpx;
|
||||
line-height:88rpx;
|
||||
font-size:32rpx;
|
||||
font-weight:500;
|
||||
}
|
||||
|
||||
.submit-btn[disabled] {
|
||||
background: #CCC;
|
||||
background:var(--color-bg-muted);
|
||||
}
|
||||
|
||||
.tips {
|
||||
background: #fff;
|
||||
border-radius: 24rpx;
|
||||
padding: 32rpx;
|
||||
background:var(--color-bg-card);
|
||||
border-radius:24rpx;
|
||||
padding:32rpx;
|
||||
}
|
||||
|
||||
.tip-title {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
margin-bottom: 16rpx;
|
||||
display:block;
|
||||
font-size:28rpx;
|
||||
font-weight:bold;
|
||||
color:var(--color-text-primary);
|
||||
margin-bottom:16rpx;
|
||||
}
|
||||
|
||||
.tip-item {
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
line-height: 2;
|
||||
display:block;
|
||||
font-size:24rpx;
|
||||
color:var(--color-text-tertiary);
|
||||
line-height:2;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user