fix(miniprogram): 登录页尺寸过大 + 排除关怀模式
- 正常模式大幅缩减：标题 48→32px、按钮高 96→56px、按钮字 32→28px logo 128→96px、副标题 26→16px、顶部留白 160→100px - 登录页不应用 elder-mode class（正常模式已足够大） - 关怀模式覆写值同步调整：标题 38px、按钮高 64px、副标题 21px Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
iven
@@ -11,7 +11,7 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 160px 56px 80px;
|
||||
padding: 100px 40px 60px;
|
||||
}
|
||||
|
||||
/* ─── 品牌区 ─── */
|
||||
@@ -19,22 +19,22 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-bottom: 80px;
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
|
||||
.login-logo {
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
border-radius: $r-lg;
|
||||
background: $pri;
|
||||
@include flex-center;
|
||||
margin-bottom: 36px;
|
||||
margin-bottom: 24px;
|
||||
box-shadow: 0 8px 24px rgba($pri, 0.3);
|
||||
}
|
||||
|
||||
.login-logo-mark {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 64px;
|
||||
font-size: 48px;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
line-height: 1;
|
||||
@@ -42,14 +42,14 @@
|
||||
|
||||
.login-title {
|
||||
font-family: 'Georgia', 'Times New Roman', serif;
|
||||
font-size: 48px;
|
||||
font-size: 32px;
|
||||
color: $tx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 12px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.login-subtitle {
|
||||
font-size: 26px;
|
||||
font-size: 16px;
|
||||
color: $tx2;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
@@ -57,7 +57,7 @@
|
||||
/* ─── 装饰线 ─── */
|
||||
.login-divider {
|
||||
width: 48px;
|
||||
margin-bottom: 64px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.login-divider-line {
|
||||
@@ -74,16 +74,18 @@
|
||||
|
||||
.login-btn {
|
||||
width: 100%;
|
||||
height: 96px;
|
||||
height: $btn-primary-h;
|
||||
background: $pri;
|
||||
color: #fff;
|
||||
font-size: 32px;
|
||||
font-size: 28px;
|
||||
font-weight: 600;
|
||||
border-radius: $r;
|
||||
border: none;
|
||||
@include flex-center;
|
||||
letter-spacing: 0.04em;
|
||||
box-shadow: 0 4px 16px rgba($pri, 0.25);
|
||||
padding: 0;
|
||||
line-height: 1;
|
||||
|
||||
&::after {
|
||||
border: none;
|
||||
@@ -98,14 +100,14 @@
|
||||
.agreement-row {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
margin-top: 40px;
|
||||
gap: 12px;
|
||||
margin-top: 28px;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.agreement-check {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border: 2px solid $bd;
|
||||
border-radius: $r-sm;
|
||||
@include flex-center;
|
||||
@@ -120,14 +122,14 @@
|
||||
}
|
||||
|
||||
.agreement-check-mark {
|
||||
font-size: 22px;
|
||||
font-size: 18px;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.agreement-text {
|
||||
font-size: 22px;
|
||||
font-size: 14px;
|
||||
color: $tx2;
|
||||
line-height: 1.7;
|
||||
}
|
||||
@@ -141,11 +143,11 @@
|
||||
.skip-row {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-top: 32px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
|
||||
.skip-btn {
|
||||
font-size: 20px;
|
||||
font-size: 16px;
|
||||
color: $tx3;
|
||||
padding: 8px 16px;
|
||||
}
|
||||
|
||||
@@ -11,6 +11,9 @@ export default function Login() {
|
||||
const [agreed, setAgreed] = useState(false);
|
||||
const { login, bindPhone, loading, isMedicalStaff } = useAuthStore();
|
||||
|
||||
// 登录页不应用关怀模式（正常模式尺寸已足够大）
|
||||
const loginClass = '';
|
||||
|
||||
const navigateAfterLogin = () => {
|
||||
if (isMedicalStaff()) {
|
||||
Taro.redirectTo({ url: '/pages/doctor/index' });
|
||||
@@ -58,7 +61,7 @@ export default function Login() {
|
||||
};
|
||||
|
||||
return (
|
||||
<ScrollView scrollY className={`login-scroll ${modeClass}`}>
|
||||
<ScrollView scrollY className={`login-scroll ${loginClass}`}>
|
||||
<View className='login-page'>
|
||||
{/* 品牌区 */}
|
||||
<View className='login-brand'>
|
||||
|
||||
@@ -305,22 +305,48 @@
|
||||
// 登录页
|
||||
// ═══════════════════════════════════════
|
||||
|
||||
.login-page {
|
||||
padding: 80px 48px 60px;
|
||||
}
|
||||
|
||||
.login-brand {
|
||||
margin-bottom: 56px;
|
||||
}
|
||||
|
||||
.login-logo {
|
||||
width: 112px;
|
||||
height: 112px;
|
||||
}
|
||||
|
||||
.login-logo-mark {
|
||||
font-size: 56px;
|
||||
}
|
||||
|
||||
.login-title {
|
||||
font-size: 56px; // 48 × 1.17 标题微增
|
||||
font-size: 38px; // 32 × 1.19 标题微增
|
||||
}
|
||||
|
||||
.login-subtitle {
|
||||
font-size: 30px; // 26 × 1.15
|
||||
font-size: 21px; // 16 × 1.31
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
height: 96px;
|
||||
font-size: 34px; // 32 × 1.06
|
||||
height: 64px;
|
||||
font-size: 30px; // 28 × 1.07
|
||||
}
|
||||
|
||||
.agreement-text {
|
||||
font-size: 18px; // 14 × 1.29
|
||||
}
|
||||
|
||||
.agreement-check {
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
}
|
||||
|
||||
.skip-btn {
|
||||
font-size: 24px; // 20 × 1.2
|
||||
height: 60px;
|
||||
font-size: 20px; // 16 × 1.25
|
||||
height: 48px;
|
||||
}
|
||||
|
||||
// ═══════════════════════════════════════
|
||||
|
||||
Reference in New Issue
Block a user