xJourney/wxapp_escort
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

AI和Mine页面的样式改成新样式了。

Browse Source
This commit is contained in:
lik
2026-10-04 19:06:45 +08:00
parent 5844272762
commit 428fb7c52c
21 changed files with 643 additions and 584 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/home/index.wxss
+18 -49
View File
@@ -6,43 +6,12 @@
- 大字号标题直接落在纸面上，不用整块色面板压首屏 */
page {
/* 暖橙主色阶：strong 是实心块/按钮（白字需 ≥4.5:1、白图标需 ≥3:1），
soft 是衬底，ink 是浅衬底上的文字与线图标 */
--brand: #F97316; /* 主色：仅装饰性小色块 */
--brand-strong: #C2410C; /* 实心按钮 / 选中态：白字 4.69:1，过 AA 正文 */
--brand-soft: #FFF4E8; /* 图标衬底、标签底 */
--brand-line: #FFE0C2; /* 浅橙衬底的描边 */
--brand-ink: #9A3412; /* 浅橙衬底上的文字/图标：6.8:1，过 AA */
/* 状态色：全页唯一的冷色，只用在「待服务订单」提醒条上。
作用是制造唯一焦点——整页暖橙平铺时需要一个"该看这里"的落点 */
/* 配色令牌已上移到 app.wxss（全站唯一来源，改配色只改那一处），本页不再留副本。
这里只剩本页专属的一样：「待服务订单」提醒条的状态色——全页唯一的冷色，
语义由 DESIGN.md §3 管，不随主色走 */
--status-soft: #ECF7F4;
--status-line: #C7E5DF;
--status-ink: #0F766E; /* #ECF7F4 上 5.0:1，过 AA 正文 */
/* 中性：暖灰阶，与暖白纸面同温（冷灰会让白卡边缘发青） */
--ink: #2B2521;
--ink-2: #4A4038;
--muted: #6F655C; /* 纸面(--paper) 5.28:1 / 白卡 5.69:1，过 AA 正文。
原 #7A7068 在白卡上 4.83:1 达标，但落在暖白纸面上只有 4.49:1，压线不过 */
--faint: #A79C92; /* 仅用于非文字装饰 */
--line: #ECE3D6; /* 米色发丝边。原 #F0E9E0 落在纸面上只有 1.12:1，等于"看得见但看不清"，
而白卡与纸面的填充差本身只有 1.08:1——边界全靠这条边，它必须站得住。
压深一档后：纸面 1.20:1 / 白卡 1.27:1 */
--paper: #FAF8F5; /* 暖白纸面。原 #FAF6F0 的 R−B=10，黄度偏重，大面积铺开会被读成
"旧纸/发闷"而不是"暖白干净"（感知亮度受色饱和度影响，
同明度下越黄越显沉）。压到 R−B=5，黄度减半，
明度反而略升（L* 97.0 → 97.7），暖白身份保留 */
--white: #FFFFFF;
/* 紧阴影：偏移与模糊半径不变（仍是"小偏移、小模糊"的锐利档），只提不透明度。
原因：上面的纸面去黄后，白卡与纸面的填充差从 1.08:1 降到 1.06:1，
卡片需要阴影来补回"浮在纸面上"的层级，否则整页更平。
0.04 时阴影几乎不可见，提到 0.07 后边缘压深约等于那道填充差本身 */
--shadow-card: 0 2rpx 10rpx rgba(63, 43, 25, 0.07);
/* 彩色阴影原为 0 6rpx 16rpx/22%：全页只有它与品牌印记两处彩色阴影，且都在首屏，
是首屏显重的主要来源，也与"小偏移、小模糊"的锐利阴影偏好相悖，故收小一档 */
--shadow-cta: 0 2rpx 8rpx rgba(194, 65, 12, 0.16);
}
.page-bg {
@@ -78,7 +47,7 @@ page {
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 2rpx 8rpx rgba(194, 65, 12, 0.16);
box-shadow: 0 2rpx 8rpx rgba(184, 82, 10, 0.16);
}
.brand-logo {
@@ -119,7 +88,7 @@ page {
两段合计 11 字 × (48rpx + 2rpx 字距) + 10rpx 间隔 ≈ 560rpx，
小于容器内宽 686rpx（750 - 32×2 页边距），不会折行 */
.hero-title-accent {
color: var(--brand-strong); /* 暖白纸面上 5.0:1，过 AA */
color: var(--brand-strong); /* 暖白纸面上 4.66:1，过 AA（50rpx/700 属大字，3:1 门槛之上） */
}
.hero-title-main {
@@ -128,7 +97,7 @@ page {
}
/* 场景行：三项核心场景两行排布（场景词 + 补充），纯展示不点击。
场景词走暖陶土 --brand-ink 做暖色标签，与标题深墨半句靠色相拉开层级，
场景词走暖橙 --brand-ink 做暖色标签，与标题深墨半句靠色相拉开层级，
避免两条深色带叠在一起；补充走 muted 保持安静。
28 → 40rpx：补充语由 8 字收到 5 字后横向已有空气，纵向再拉开一档 */
.scene-row {
@@ -147,9 +116,9 @@ page {
.scene-name {
font-size: 30rpx;
font-weight: 700;
/* 暖陶土 --brand-ink：与标题深墨半句「让就医更省心」同屏时靠色相拉开层级，
/* 暖橙 --brand-ink：与标题深墨半句「让就医更省心」同屏时靠色相拉开层级，
避免两段 ink+700 连排成"两条深色带"；比标题的 --brand-strong 低一档分量，
标题仍是首屏唯一的亮橙焦点。纸面上 6.8:1，过 AA */
标题仍是首屏唯一的暖色焦点。纸面上 6.10:1，过 AA */
color: var(--brand-ink);
letter-spacing: 1rpx;
}
@@ -231,7 +200,7 @@ page {
.intro-trust-item {
font-size: 24rpx;
font-weight: 700;
color: var(--brand-ink); /* 浅橙底 6.8:1，过 AA */
color: var(--brand-ink); /* 浅橙底 5.96:1，过 AA */
letter-spacing: 1rpx;
}
@@ -344,7 +313,7 @@ page {
transform: scale(0.94);
}
/* 纤细线图标：24x24 网格、stroke-width 1.5、暖橙 #C2410C，base64 内嵌避免引入图标字体。
/* 纤细线图标：24x24 网格、stroke-width 1.5、暖橙 #B8520A，base64 内嵌避免引入图标字体。
60rpx(30px) 是过 WCAG 非文本 3:1 后兼顾真机清晰度、减少白卡空荡感的尺寸。
图标直接落在白卡上、不加衬底方块：衬底层级已让给上方主推卡，小宫格保持安静 */
.assist-icon {
@@ -358,43 +327,43 @@ page {
/* 1 全天陪诊：整圈表盘 + 指针 */
.assist-icon-1 {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4LjUiLz48cGF0aCBkPSJNMTIgNi42VjEybDMuOCAyLjIiLz48L3N2Zz4=");
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4LjUiLz48cGF0aCBkPSJNMTIgNi42VjEybDMuOCAyLjIiLz48L3N2Zz4=");
}
/* 2 半天陪诊：整圈表盘 + 右半实心填充，与 1 的"空心全圈"形成"全 / 半"对照，
避免原半月形在小尺寸下被误读为字母 D */
.assist-icon-2 {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4LjUiLz48cGF0aCBkPSJNMTIgMy41YTguNSA4LjUgMCAwIDEgMCAxN1oiIGZpbGw9IiNDMjQxMEMiIHN0cm9rZT0ibm9uZSIvPjwvc3ZnPg==");
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSI4LjUiLz48cGF0aCBkPSJNMTIgMy41YTguNSA4LjUgMCAwIDEgMCAxN1oiIGZpbGw9IiNCODUyMEEiIHN0cm9rZT0ibm9uZSIvPjwvc3ZnPg==");
}
/* 3 代问诊：对话气泡 + 医疗十字 */
.assist-icon-3 {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNMjAgMTQuNWEyLjUgMi41IDAgMCAxLTIuNSAyLjVIOGwtNCAzLjVWNmEyLjUgMi41IDAgMCAxIDIuNS0yLjVoMTFBMi41IDIuNSAwIDAgMSAyMCA2WiIvPjxwYXRoIGQ9Ik0xMiA3LjZ2NS4yTTkuNCAxMC4yaDUuMiIvPjwvc3ZnPg==");
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNMjAgMTQuNWEyLjUgMi41IDAgMCAxLTIuNSAyLjVIOGwtNCAzLjVWNmEyLjUgMi41IDAgMCAxIDIuNS0yLjVoMTFBMi41IDIuNSAwIDAgMSAyMCA2WiIvPjxwYXRoIGQ9Ik0xMiA3LjZ2NS4yTTkuNCAxMC4yaDUuMiIvPjwvc3ZnPg==");
}
/* 4 检查预约：日历 + 对勾 */
.assist-icon-4 {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cmVjdCB4PSIzLjUiIHk9IjUiIHdpZHRoPSIxNyIgaGVpZ2h0PSIxNS41IiByeD0iMi41Ii8+PHBhdGggZD0iTTggM3Y0TTE2IDN2NE0zLjUgOS41aDE3Ii8+PHBhdGggZD0ibTkuNCAxNSAxLjkgMS45IDMuNy00Ii8+PC9zdmc+");
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cmVjdCB4PSIzLjUiIHk9IjUiIHdpZHRoPSIxNyIgaGVpZ2h0PSIxNS41IiByeD0iMi41Ii8+PHBhdGggZD0iTTggM3Y0TTE2IDN2NE0zLjUgOS41aDE3Ii8+PHBhdGggZD0ibTkuNCAxNSAxLjkgMS45IDMuNy00Ii8+PC9zdmc+");
}
/* 5 出入院代办：医院楼 + 地面 + 十字 */
.assist-icon-5 {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNNC41IDIwLjVWNi41YTIgMiAwIDAgMSAyLTJoMTFhMiAyIDAgMCAxIDIgMnYxNCIvPjxwYXRoIGQ9Ik0yLjUgMjAuNWgxOSIvPjxwYXRoIGQ9Ik0xMiA4LjZ2NU05LjUgMTEuMWg1Ii8+PC9zdmc+");
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNNC41IDIwLjVWNi41YTIgMiAwIDAgMSAyLTJoMTFhMiAyIDAgMCAxIDIgMnYxNCIvPjxwYXRoIGQ9Ik0yLjUgMjAuNWgxOSIvPjxwYXRoIGQ9Ik0xMiA4LjZ2NU05LjUgMTEuMWg1Ii8+PC9zdmc+");
}
/* 6 跑腿服务：包裹箱 */
.assist-icon-6 {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNMjAuNSA4LjJ2Ny42YTEuNiAxLjYgMCAwIDEtLjg0IDEuNDJsLTYuOSAzLjhhMS42IDEuNiAwIDAgMS0xLjUyIDBsLTYuOS0zLjhBMS42IDEuNiAwIDAgMSAzLjUgMTUuOFY4LjJhMS42IDEuNiAwIDAgMSAuODQtMS40Mmw2LjktMy44YTEuNiAxLjYgMCAwIDEgMS41MiAwbDYuOSAzLjhBMS42IDEuNiAwIDAgMSAyMC41IDguMloiLz48cGF0aCBkPSJNMy45IDcuMyAxMiAxMS43bDguMS00LjRNMTIgMTEuN1YyMSIvPjwvc3ZnPg==");
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNMjAuNSA4LjJ2Ny42YTEuNiAxLjYgMCAwIDEtLjg0IDEuNDJsLTYuOSAzLjhhMS42IDEuNiAwIDAgMS0xLjUyIDBsLTYuOS0zLjhBMS42IDEuNiAwIDAgMSAzLjUgMTUuOFY4LjJhMS42IDEuNiAwIDAgMSAuODQtMS40Mmw2LjktMy44YTEuNiAxLjYgMCAwIDEgMS41MiAwbDYuOSAzLjhBMS42IDEuNiAwIDAgMSAyMC41IDguMloiLz48cGF0aCBkPSJNMy45IDcuMyAxMiAxMS43bDguMS00LjRNMTIgMTEuN1YyMSIvPjwvc3ZnPg==");
}
/* 7 陪诊套餐：礼盒 */
.assist-icon-7 {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cmVjdCB4PSIzIiB5PSI3LjUiIHdpZHRoPSIxOCIgaGVpZ2h0PSI0LjUiIHJ4PSIxLjIiLz48cGF0aCBkPSJNNC41IDEydjcuNUExLjUgMS41IDAgMCAwIDYgMjFoMTJhMS41IDEuNSAwIDAgMCAxLjUtMS41VjEyIi8+PHBhdGggZD0iTTEyIDcuNVYyMSIvPjxwYXRoIGQ9Ik0xMiA3LjVIOS4yYTIuMyAyLjMgMCAxIDEgMC00LjZDMTAuNyAyLjkgMTIgNy41IDEyIDcuNVoiLz48cGF0aCBkPSJNMTIgNy41aDIuOGEyLjMgMi4zIDAgMSAwIDAtNC42QzEzLjMgMi45IDEyIDcuNSAxMiA3LjVaIi8+PC9zdmc+");
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cmVjdCB4PSIzIiB5PSI3LjUiIHdpZHRoPSIxOCIgaGVpZ2h0PSI0LjUiIHJ4PSIxLjIiLz48cGF0aCBkPSJNNC41IDEydjcuNUExLjUgMS41IDAgMCAwIDYgMjFoMTJhMS41IDEuNSAwIDAgMCAxLjUtMS41VjEyIi8+PHBhdGggZD0iTTEyIDcuNVYyMSIvPjxwYXRoIGQ9Ik0xMiA3LjVIOS4yYTIuMyAyLjMgMCAxIDEgMC00LjZDMTAuNyAyLjkgMTIgNy41IDEyIDcuNVoiLz48cGF0aCBkPSJNMTIgNy41aDIuOGEyLjMgMi4zIDAgMSAwIDAtNC42QzEzLjMgMi45IDEyIDcuNSAxMiA3LjVaIi8+PC9zdmc+");
}
/* 8 买药套餐：45° 斜置胶囊 + 中缝，避免原横置胶囊被误读为"链接"图标 */
.assist-icon-8 {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQzI0MTBDIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cmVjdCB4PSI0LjIiIHk9IjguMiIgd2lkdGg9IjE1LjYiIGhlaWdodD0iNy42IiByeD0iMy44IiB0cmFuc2Zvcm09InJvdGF0ZSgtNDUgMTIgMTIpIi8+PHBhdGggZD0iTTkuMyA5LjNsNS40IDUuNCIvPjwvc3ZnPg==");
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQjg1MjBBIiBzdHJva2Utd2lkdGg9IjEuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cmVjdCB4PSI0LjIiIHk9IjguMiIgd2lkdGg9IjE1LjYiIGhlaWdodD0iNy42IiByeD0iMy44IiB0cmFuc2Zvcm09InJvdGF0ZSgtNDUgMTIgMTIpIi8+PHBhdGggZD0iTTkuMyA5LjNsNS40IDUuNCIvPjwvc3ZnPg==");
}
/* 宫格项名统一走 28rpx 标题档（与 .quick-name 同级）。