feat ui设计稿bug修复

This commit is contained in:
Ironsp
2026-10-01 10:53:13 +08:00
parent 9ab6253c81
commit 1601bdd82c
89 changed files with 4741 additions and 3652 deletions

View File

@@ -35,7 +35,9 @@ const localAgree = computed({
<template>
<form class="login-form" @submit.prevent="emit('submit')">
<div class="login-form__field">
<label class="login-form__label" for="login-account">账号</label>
<input
id="login-account"
v-model="localAccount"
class="login-form__input"
type="text"
@@ -44,7 +46,9 @@ const localAgree = computed({
>
</div>
<div class="login-form__field">
<label class="login-form__label" for="login-password">密码</label>
<input
id="login-password"
v-model="localPassword"
class="login-form__input"
type="password"
@@ -57,30 +61,45 @@ const localAgree = computed({
<span>已阅读并同意<em>《用户协议》</em>和<em>《隐私政策》</em></span>
</label>
<button class="login-form__submit" type="submit">
登 录
登录
</button>
</form>
</template>
<style lang="less" scoped>
.login-form {
.flex(column, flex-start);
gap: @spacing-lg;
.flex(column, flex-start, stretch);
// 设计稿:Tab 行 x1039 → 表单列整列 x1039 = 卡列 x1022 + 17
margin: 26px 0 0 17px;
width: 680px;
&__field {
width: 100%;
.flex(column, flex-start, stretch);
gap: 8px;
width: 680px;
}
// 设计稿:输入框 40 设计px ≈ 32px 高、13 设计px 字号(可读下限 11px)、白底浅描边
&__field + &__field {
margin-top: 64px;
}
&__label {
font-size: 13px; // 设计稿 13/500 #1F2937
font-weight: 500;
line-height: 17px;
color: #1f2937;
}
// 设计稿:输入框 680×39、白底 + #DDE1E7 描边、文字 13/400
&__input {
width: 100%;
height: 32px;
height: 39px;
padding: 0 12px;
border: 1px solid @border-color;
border-radius: 6px;
border: 1px solid #dde1e7;
border-radius: @radius-sm;
background: @white;
font-size: 11px;
color: @heading-color;
font-size: 13px;
color: #1f2937;
outline: none;
transition: border-color 0.2s;
box-sizing: border-box;
@@ -90,19 +109,26 @@ const localAgree = computed({
}
&::placeholder {
color: @heading-color;
color: #1f2937;
}
}
// 设计稿:协议行 @(1039,641);密码输入底 649 → 协议行文字基线对齐
&__agree {
.flex(row, flex-start);
gap: @spacing-xs;
font-size: 11px;
color: @text-color-secondary;
.flex(row, flex-start, center);
gap: 8px;
margin-top: -8px;
font-size: 12px;
font-weight: 400;
line-height: 16px;
color: #6b7280;
cursor: pointer;
input {
margin-top: 1px;
flex-shrink: 0;
width: 16px;
height: 16px;
margin: 0;
accent-color: @primary-strong;
}
@@ -113,17 +139,17 @@ const localAgree = computed({
}
}
// 设计稿:登录按钮 44 设计px ≈ 34px 高、#024FFF 实底
// 设计稿:登录按钮 680×46 @y675、#024FFF 实底、文字 15/500
&__submit {
width: 100%;
height: 34px;
height: 46px;
margin-top: 18px;
border: none;
border-radius: 6px;
border-radius: @radius-sm;
background: @primary-strong;
color: @white;
font-size: 12px;
font-size: 15px;
font-weight: 500;
letter-spacing: 2px;
cursor: pointer;
transition: background 0.2s;