98dd7f93 by 杨威

登录页修改

1 parent c2c50f3c
<template>
<div id="login">
<img class="login-logo" src="./images/logo-login.svg" />
<div class="login-logo"><img src="./images/logo-login.svg" /></div>
<div class="login-con">
<div class="login-title">用户登录</div>
<!-- <div class="login-title">用户登录</div>-->
<div class="login-user" :class="{ 'select-border': change.user }">
<img class="user-icon" src="./images/user.svg" />
<div class="line-mid"></div>
<!-- <div class="line-mid"></div>-->
<input
type="text"
class="user-input"
......@@ -18,7 +18,7 @@
</div>
<div class="login-user user-mt" :class="{ 'select-border': change.pass }">
<img class="user-icon" src="./images/password.svg" />
<div class="line-mid"></div>
<!-- <div class="line-mid"></div>-->
<input
type="password"
class="user-input"
......@@ -184,74 +184,82 @@ export default {
#login {
width: 100vw;
height: 100vh;
background: url("./images/login-bg.png") center center no-repeat;
background: url("./images/login-bg.png") no-repeat bottom center;
background-size: 100% 100%;
overflow: hidden;
position: relative;
//position: relative;
.login-logo {
display: block;
margin: 0 auto;
position: absolute;
top: 11.5%;
left: 0;
right: 0;
margin: 0 auto;
width: 360px;
//display: block;
//position: absolute;
//top: 8%;
//left: 0;
//right: 0;
margin-top: 8%;
height: 160px;
width: 100%;
text-align: center;
}
.login-logo img{
height: 100%;
}
.login-con {
position: absolute;
top: 24%;
left: 0;
right: 0;
margin: 0 auto;
}
.login-title {
width: 320px;
margin: 0 auto;
font-size: 14px;
font-weight: 500;
//position: absolute;
//top: 24%;
//left: 0;
//right: 0;
margin: 10px auto;
width: 380px;
}
//.login-title {
// width: 320px;
// margin: 0 auto;
// font-size: 14px;
// font-weight: 500;
//}
.login-user {
width: 320px;
height: 38px;
width: 100%;
height: 46px;
border: 1px solid rgba(155, 155, 155, 1);
box-sizing: border-box;
margin: 0 auto;
margin-top: 20px;
margin: 38px auto auto auto;
border-radius: 2px;
position: relative;
//position: relative;
.user-icon {
margin: 0 12px;
float: left;
width: 16px;
height: 16px;
margin-top: 11px;
}
.line-mid {
width: 1px;
height: 16px;
background: #cbcbcb;
float: left;
margin-top: 11px;
margin-right: 9px;
float: left;
margin: 13px auto auto 10px;
//float: left;
width: 28px;
height: 18px;
//margin-top: 11px;
}
//.line-mid {
// width: 1px;
// height: 16px;
// background: #cbcbcb;
// float: left;
// margin-top: 11px;
// margin-right: 9px;
//}
.user-input {
width: 230px;
width: 80%;
float: left;
font-size: 12px;
margin-top: 11px;
background: none;
font-size: 16px;
//margin-top: 11px;
//background: none;
outline: 0;
border: 0;
border: none;
color: #4a4a4a;
box-shadow: inset 0 0 0 1000px #fff !important;
line-height: 266%;
//box-shadow: inset 0 0 0 1000px #fff !important;
}
.password-eye {
float: right;
width: 16px;
height: 16px;
margin-right: 12px;
margin-top: 11px;
margin-top: 13px;
cursor: pointer;
}
.warning {
......@@ -310,11 +318,8 @@ export default {
cursor: pointer;
}
.reserved-con {
position: absolute;
bottom: 36%;
left: 0;
right: 0;
margin: 0 auto;
margin: 38px auto;
}
.reserved-words {
font-size: 12px;
......