修改了样式

This commit is contained in:
lik
2026-10-18 22:14:49 +08:00
parent ed36a0db0a
commit 031227710d
14 changed files with 384 additions and 356 deletions
+77 -50
View File
@@ -47,6 +47,7 @@ page {
}
.profile-card {
position: relative;
padding: 28rpx 28rpx 24rpx;
border-radius: 28rpx;
background: var(--white);
@@ -60,28 +61,70 @@ page {
margin-top: 24rpx;
}
/* 主体整块可点进编辑。chevron 已去掉,点击暗示由按下态(.profile-main-hover)承担 */
/* 主体整块可点进编辑。chevron 已去掉,点击暗示由按下态(.profile-main-hover)承担:
transform: scale(0.99)——与记录卡(recordlist .record-card:active)同一套按压语言 */
.profile-main {
display: flex;
align-items: center;
justify-content: space-between;
transition: transform 0.15s ease;
}
.profile-main-hover {
opacity: 0.7;
transform: scale(0.99);
}
/* 首字牌:浅橙衬底 + --brand-line 描边,与订单详情页就诊人身份牌同源
(88rpx、24rpx 圆角、40rpx/700 暖橙姓氏首字;无姓名退到 user 图标) */
.profile-mark {
box-sizing: border-box;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
width: 88rpx;
height: 88rpx;
border: 2rpx solid var(--brand-line);
border-radius: 24rpx;
background: var(--brand-soft);
}
.profile-mark-text {
font-size: 40rpx;
font-weight: 700;
color: var(--brand-ink);
letter-spacing: 1rpx;
}
.profile-info {
flex: 1;
min-width: 0;
margin-left: 20rpx;
}
/* 删除:右上角安静图标。56rpx 热区 + 12rpx 内缩,不压卡边;
图标走 --muted 档(#6F655C 与令牌同步),按下整粒变淡作反馈 */
.profile-delete {
position: absolute;
top: 8rpx;
right: 8rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 56rpx;
height: 56rpx;
border-radius: 16rpx;
}
.profile-delete:active {
opacity: 0.5;
}
.profile-top {
display: flex;
align-items: center;
margin-bottom: 12rpx;
/* 右侧给删除图标留位,长姓名 + 性别签不被压住 */
padding-right: 64rpx;
}
/* 姓名是本页最重的字,走 --ink 700(标题档) */
@@ -92,68 +135,52 @@ page {
}
/* 性别签:浅橙衬底档(--brand-soft + 2rpx --brand-line + --brand-ink),
圆角 10rpx 与记录页状态胶囊同一族(徽章/标签圆角规范值),
字号 24rpx 是中文最小字号下限,不得再小 */
.sex-tag {
margin-left: 16rpx;
padding: 4rpx 12rpx;
border-radius: 6rpx;
padding: 4rpx 14rpx;
border-radius: 10rpx;
background: var(--brand-soft);
border: 2rpx solid var(--brand-line);
font-size: 24rpx;
color: var(--brand-ink);
}
/* 标签走 --muted、值走 --ink-2:只表示文字层级,不给可点性上色 */
.info-row {
/* 元信息行:出生年月 | 电话 | 证件号,空值在 JS 里整项剔除(连同分隔线),
竖线 2rpx×20rpx 取 --sep——与订单详情页 meta 行同一套写法 */
.meta-list {
display: flex;
align-items: flex-start;
align-items: center;
margin-top: 12rpx;
}
.info-row + .info-row {
margin-top: 8rpx;
.meta-item {
font-size: 24rpx;
color: var(--muted);
letter-spacing: 1rpx;
line-height: 1.6;
}
.info-label {
.meta-sep {
flex-shrink: 0;
width: 140rpx;
font-size: 26rpx;
color: var(--muted);
}
.info-value {
flex: 1;
min-width: 0;
font-size: 28rpx;
color: var(--ink-2);
word-break: break-all;
}
/* 卡片操作行:与主体隔一条发丝线,删除靠右排(与「邮寄地址」卡同一位置) */
.profile-actions {
display: flex;
align-items: center;
justify-content: flex-end;
margin-top: 24rpx;
padding-top: 20rpx;
border-top: 2rpx solid var(--line);
}
/* 文字只有 26rpx 高,用 padding 撑热区、等量负外边距抵消,不改变行高 */
.profile-action {
display: flex;
align-items: center;
padding: 16rpx 0;
margin: -16rpx 0;
}
.profile-action-icon {
margin-right: 10rpx;
color: var(--muted);
}
.profile-action-text {
font-size: 26rpx;
width: 2rpx;
height: 20rpx;
margin: 0 14rpx;
background: var(--sep);
}
/* 健康备注:单行省略——列表只做提示,全文进编辑页看 */
.profile-remark {
display: block;
margin-top: 8rpx;
font-size: 24rpx;
color: var(--muted);
letter-spacing: 1rpx;
line-height: 1.6;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/* ===== 空态 ===== */