页面调整
This commit is contained in:
@@ -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);
|
||||
|
Reference in New Issue
Block a user