页面调整

This commit is contained in:
2025-08-28 11:49:30 +08:00
parent cff90138cc
commit e45b447773
8 changed files with 27 additions and 21 deletions

View File

@@ -8,20 +8,20 @@
<!-- 表单区域 -->
<view class="login-form">
<view class="input-row">
<image class="iconfont" src="/static/aidex/login/ic_login_user.png" />
<image class="iconfont" src="/static/aidex/login/ic_login_user.svg" />
<input class="login-input" type="text" placeholder="输入账号" v-model="username" />
</view>
<view class="input-row">
<image class="iconfont2" src="/static/aidex/login/ic_login_pwd.png" />
<image class="iconfont2" src="/static/aidex/login/ic_login_pwd.svg" />
<input class="login-input" type="password" v-model="password" placeholder="请输入密码" />
</view>
<view class="protocol-row">
<label class="custom-checkbox-label">
<!-- <label class="custom-checkbox-label">
<input type="checkbox" :checked="checked" @change="handleCheckboxChange"
class="custom-checkbox-input" />
<image :src="checked ? '/static/ic_login_agree.png' : '/static/ic_login_dis.png'"
class="custom-checkbox-img" @click="handleCheckboxChange({ target: { checked: !checked }})" />
</label>
</label> -->
<text>同意</text>
<text class="protocol-link">用户协议</text>
<text></text>
@@ -203,6 +203,7 @@
.login-container {
width: 100%;
height:100%;
position: relative;
border-radius: 24px;
overflow: hidden;
@@ -210,7 +211,7 @@
transition: all 0.3s ease;
}
/* 响应式调整 */
/* 响应式调整
@media (max-width: 600px) {
.login-container {
border-radius: 16px;
@@ -223,7 +224,7 @@
max-width: 95%;
}
}
*/
.login-header {
position: relative;
height: 35vh;
@@ -256,8 +257,8 @@
}
.login-title {
font-size: clamp(28px, 5vw, 36px);
font-weight: 700;
font-size: 36px;
font-weight: bold;
margin-bottom: 8px;
}
@@ -268,8 +269,9 @@
}
.login-form {
height:100%;
background: white;
padding: clamp(20px, 5vw, 30px);
padding: 30px;
border-radius: 0 0 24px 24px;
position: relative;
z-index: 10;
@@ -288,8 +290,8 @@
}
.iconfont, .iconfont2 {
width: clamp(20px, 4vw, 24px);
height: clamp(20px, 4vw, 24px);
width: 2rem;
height: 2rem;
margin-right: 12px;
flex-shrink: 0;
}
@@ -298,7 +300,7 @@
flex: 1;
border: none;
outline: none;
font-size: clamp(14px, 4vw, 16px);
font-size: 16px;
color: #333;
min-width: 0; /* 防止flex项目溢出 */
}
@@ -311,7 +313,7 @@
display: flex;
align-items: center;
margin: clamp(15px, 4vw, 20px) 0 clamp(20px, 5vw, 30px);
font-size: clamp(12px, 3vw, 14px);
font-size: 10px;
color: #666;
flex-wrap: wrap;
}
@@ -344,14 +346,16 @@
}
.login-btn {
width: 100%;
height: clamp(45px, 10vw, 50px);
width: 60%;
position: relative;
left: 20%;
height: clamp(40px, 10vw, 50px);
background: linear-gradient(90deg, #2e6cf6 0%, #4fc3f7 100%);
color: white;
border: none;
border-radius: clamp(20px, 8vw, 25px);
border-radius: 25px;
font-size: clamp(14px, 4vw, 16px);
font-weight: 600;
font-weight: bold;
cursor: pointer;
transition: all 0.3s;
box-shadow: 0 4px 12px rgba(46, 108, 246, 0.3);