:style:优化登录页ui

This commit is contained in:
不做码农 2023-09-10 08:13:35 +08:00
parent a6fc1168d7
commit 2c922c5fdd
4 changed files with 16 additions and 17 deletions

View File

@ -16,6 +16,7 @@
border-radius: 6px;
width: var(--base-login-width);
position: relative;
height: 420px;
}
}
@ -28,7 +29,7 @@
.login-form {
padding: 5px 25px 5px 25px;
position: relative;
height: 250px;
// height: 250px;
.input-icon {
height: 30px;
@ -115,6 +116,7 @@
text-align: center;
align-items: center;
justify-content: space-around;
margin-bottom: 20px;
}
@media screen and (max-width: 500px) {

View File

@ -40,7 +40,7 @@
<script setup name="phonelogin">
import { getCodeImg } from '@/api/system/login'
import useUserStore from '@/store/modules/user'
// import useUserStore from '@/store/modules/user'
const route = useRoute()
const { proxy } = getCurrentInstance()
@ -98,9 +98,4 @@ getCode()
<style lang="scss" scoped>
@import '@/assets/styles/login.scss';
.forget-pwd {
color: #ccc;
margin-right: 10px;
cursor: pointer;
}
</style>

View File

@ -40,20 +40,20 @@
</div>
</el-form-item>
<div style="display: flex; justify-content: space-between; align-items: center">
<el-checkbox v-model="loginForm.rememberMe">{{ $t('login.rememberMe') }}</el-checkbox>
<span style="font-size: 12px">
<span @click="handleForgetPwd()" class="forget-pwd">{{ $t('login.forgotPwd') }}</span>
<router-link class="link-type" :to="'/register'">{{ $t('login.register') }}</router-link>
</span>
</div>
<el-form-item style="width: 100%" :style="{ 'margin-top': captchaOnOff == 'off' ? '40px' : '' }">
<el-button :loading="loading" size="default" round type="primary" style="width: 100%" @click.prevent="handleLogin">
<span v-if="!loading">{{ $t('login.btnLogin') }}</span>
<span v-else> 中...</span>
</el-button>
</el-form-item>
<div style="display: flex; justify-content: space-between; align-items: center">
<el-checkbox v-model="loginForm.rememberMe">{{ $t('login.rememberMe') }}</el-checkbox>
<span style="font-size: 12px">
<router-link class="link-type" :to="'/register'">{{ $t('login.register') }}</router-link>
<span @click="handleForgetPwd()" class="forget-pwd">{{ $t('login.forgotPwd') }}</span>
</span>
</div>
</el-form>
<div class="qr-wrap login-form" v-show="loginType == 3">
<div class="login-scan-container">
@ -258,8 +258,10 @@ getCookie()
@import '@/assets/styles/login.scss';
.forget-pwd {
color: #ccc;
margin-right: 10px;
margin-left: 10px;
cursor: pointer;
border-left: 1px solid;
padding-left: 10px;
}
.qrCode {
width: 160px;

View File

@ -162,7 +162,7 @@ getCode()
background: radial-gradient(220% 105% at top center, #1b2947 10%, #4b76a7 40%, #81acae 65%, #f7f7b6);
}
.login-form {
height: 380px;
padding: 15px 25px 15px 25px;
}
.title {
margin: 0px auto 30px auto;