This commit is contained in:
lik
2026-10-02 15:17:52 +08:00
parent a4627592b4
commit ce8eb85019
3 changed files with 35 additions and 21 deletions
+3 -2
View File
@@ -31,7 +31,7 @@ Page({
quickEntries: [{ quickEntries: [{
id: 'records', id: 'records',
name: '预约记录', name: '预约记录',
// 横排布局后文字区变窄,desc 控制在 8 字内避免折行 // 横排布局后文字区变窄,右侧又补了 chevron(文字区约 179rpx),desc 控制在 7 字内避免折行
desc: '查看进度与历史', desc: '查看进度与历史',
// 日历:与「健康档案」的人形图标形成明显形态差异(原先两个都是"文档+勾",缩小后难分辨) // 日历:与「健康档案」的人形图标形成明显形态差异(原先两个都是"文档+勾",缩小后难分辨)
icon: 'calendar-1', icon: 'calendar-1',
@@ -40,7 +40,8 @@ Page({
{ {
id: 'health', id: 'health',
name: '健康档案', name: '健康档案',
desc: '管理家人就诊信息', // 原「管理家人就诊信息」8 字 + 右侧箭头会折行,收到 6 字
desc: '管理家人信息',
icon: 'user-checked', icon: 'user-checked',
url: '/pages/health/profilelist' url: '/pages/health/profilelist'
}, },
+5 -4
View File
@@ -59,7 +59,7 @@
<!-- 指南入口放标题行右侧:进区块即见,不必滚过宫格 --> <!-- 指南入口放标题行右侧:进区块即见,不必滚过宫格 -->
<view class="section-link" bindtap="goToGuide"> <view class="section-link" bindtap="goToGuide">
<text class="section-link-text">服务指南</text> <text class="section-link-text">服务指南</text>
<t-icon name="chevron-right" size="24rpx" color="#7A7068" /> <t-icon name="chevron-right" size="24rpx" color="#6F655C" />
</view> </view>
</view> </view>
@@ -115,9 +115,10 @@
<text class="quick-name">{{ item.name }}</text> <text class="quick-name">{{ item.name }}</text>
<text class="quick-desc">{{ item.desc }}</text> <text class="quick-desc">{{ item.desc }}</text>
</view> </view>
<!-- 通栏卡右侧补箭头:填补右半空白并提示可点 --> <!-- 每张卡都补右侧箭头:两列卡不再是"无暗示的整卡可点",
<view class="quick-arrow" wx:if="{{ item.full }}"> 通栏卡同时填补右半空白 -->
<t-icon name="chevron-right" size="28rpx" color="#7A7068" /> <view class="quick-arrow">
<t-icon name="chevron-right" size="28rpx" color="#6F655C" />
</view> </view>
</view> </view>
</view> </view>
+27 -15
View File
@@ -23,7 +23,8 @@ page {
/* 中性:暖灰阶,与暖白纸面同温(冷灰会让白卡边缘发青) */ /* 中性:暖灰阶,与暖白纸面同温(冷灰会让白卡边缘发青) */
--ink: #2B2521; --ink: #2B2521;
--ink-2: #4A4038; --ink-2: #4A4038;
--muted: #7A7068; /* 白底 4.8:1,过 AA 正文 */ --muted: #6F655C; /* 纸面(--paper) 5.28:1 / 白卡 5.69:1,过 AA 正文。
原 #7A7068 在白卡上 4.83:1 达标,但落在暖白纸面上只有 4.49:1,压线不过 */
--faint: #A79C92; /* 仅用于非文字装饰 */ --faint: #A79C92; /* 仅用于非文字装饰 */
--line: #F0E9E0; /* 米色发丝边 */ --line: #F0E9E0; /* 米色发丝边 */
--paper: #FAF6F0; /* 暖白纸面 */ --paper: #FAF6F0; /* 暖白纸面 */
@@ -172,7 +173,7 @@ page {
.hero-cta-text { .hero-cta-text {
font-size: 30rpx; font-size: 30rpx;
font-weight: 600; font-weight: 700;
color: var(--white); color: var(--white);
letter-spacing: 2rpx; letter-spacing: 2rpx;
margin-right: 6rpx; margin-right: 6rpx;
@@ -211,15 +212,17 @@ page {
.intro-trust-item { .intro-trust-item {
font-size: 24rpx; font-size: 24rpx;
font-weight: 600; font-weight: 700;
color: var(--brand-ink); /* 浅橙底 6.8:1,过 AA */ color: var(--brand-ink); /* 浅橙底 6.8:1,过 AA */
letter-spacing: 1rpx; letter-spacing: 1rpx;
} }
/* 分隔竖线:不能用 --brand-line(#FFE0C2)——它落在浅橙底 #FFF4E8 上只有 1.16:1,肉眼看不见。
改用 #E5DACC,与场景行、页脚的竖分隔线同一档,保证在浅橙底上也能看见 */
.intro-trust-sep { .intro-trust-sep {
width: 2rpx; width: 2rpx;
height: 20rpx; height: 20rpx;
background: var(--brand-line); background: #E5DACC;
margin: 0 16rpx; margin: 0 16rpx;
flex-shrink: 0; flex-shrink: 0;
} }
@@ -256,9 +259,12 @@ page {
} }
/* 标题行右侧入口(如「服务指南」):靠 margin-left:auto 右对齐。 /* 标题行右侧入口(如「服务指南」):靠 margin-left:auto 右对齐。
走 muted 而非暖橙,把橙色焦点留给 hero 标题;24rpx 白底 4.8:1 过 AA */ 走 muted 而非暖橙,把橙色焦点留给 hero 标题;24rpx 纸面 5.28:1 过 AA。
文字只有 24rpx 高,用 padding 把点击热区撑到 56rpx(28px),
再用等量负外边距抵消,保证标题行的高度与上下间距不变 */
.section-link { .section-link {
margin-left: auto; margin: -16rpx 0 -16rpx auto;
padding: 16rpx 0;
display: flex; display: flex;
align-items: center; align-items: center;
flex-shrink: 0; flex-shrink: 0;
@@ -359,7 +365,7 @@ page {
4 列布局列宽 ≈ 167rpx,5 字项名「出入院代办」= 140rpx,不折行 */ 4 列布局列宽 ≈ 167rpx,5 字项名「出入院代办」= 140rpx,不折行 */
.assist-name { .assist-name {
font-size: 28rpx; font-size: 28rpx;
font-weight: 600; font-weight: 700;
color: var(--ink-2); color: var(--ink-2);
} }
@@ -391,7 +397,7 @@ page {
.order-tip-text { .order-tip-text {
flex: 1; flex: 1;
font-size: 28rpx; font-size: 28rpx;
font-weight: 600; font-weight: 700;
color: var(--status-ink); color: var(--status-ink);
} }
@@ -431,15 +437,17 @@ page {
box-sizing: border-box; box-sizing: border-box;
} }
/* 68 → 60rpx:两列卡右侧补了 chevron 后文字区被压缩,
衬底缩一档给 desc 让出宽度(60rpx/30px 仍在真机清晰区间内) */
.quick-icon { .quick-icon {
width: 68rpx; width: 60rpx;
height: 68rpx; height: 60rpx;
border-radius: 20rpx; border-radius: 18rpx;
background: var(--brand-soft); background: var(--brand-soft);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
margin-right: 16rpx; margin-right: 14rpx;
flex-shrink: 0; flex-shrink: 0;
} }
@@ -451,7 +459,7 @@ page {
.quick-name { .quick-name {
font-size: 28rpx; font-size: 28rpx;
font-weight: 600; font-weight: 700;
color: var(--ink); color: var(--ink);
} }
@@ -461,7 +469,8 @@ page {
margin-top: 6rpx; margin-top: 6rpx;
} }
/* 通栏卡右侧箭头:填补右半空白并提示可点 */ /* 每张卡右侧箭头:两列卡此前没有任何点击暗示,属于"无暗示的整卡可点",
与通栏卡不一致;补齐后三张卡语言统一,通栏卡同时填补右半空白 */
.quick-arrow { .quick-arrow {
margin-left: auto; margin-left: auto;
flex-shrink: 0; flex-shrink: 0;
@@ -486,9 +495,12 @@ page {
margin-bottom: 20rpx; margin-bottom: 20rpx;
} }
/* 文字只有 24rpx 高,用 padding 撑热区、等量负外边距抵消,不影响页脚原有行距 */
.footer-link { .footer-link {
padding: 16rpx 0;
margin: -16rpx 0;
font-size: 24rpx; font-size: 24rpx;
color: var(--muted); /* 暖白底 4.83:1,过 AA 正文 */ color: var(--muted); /* 纸面 5.28:1,过 AA 正文 */
letter-spacing: 1rpx; letter-spacing: 1rpx;
} }