88 lines
5.1 KiB
SCSS
88 lines
5.1 KiB
SCSS
.login-main {
|
||
display: flex;
|
||
flex-direction: row;
|
||
//background-color: rgb(238, 255, 238);
|
||
width: 100vw;
|
||
height: 100vh;
|
||
/* 加载背景图 */
|
||
background-image: url("@/assets/images/background.png");
|
||
/* 背景图垂直、水平均居中 */
|
||
background-position: center center;
|
||
/* 背景图不平铺 */
|
||
background-repeat: no-repeat;
|
||
/* 当内容高度大于图片高度时，背景图像的位置相对于viewport固定 */
|
||
background-attachment: fixed;
|
||
/* 让背景图基于容器大小伸缩 */
|
||
background-size: cover;
|
||
|
||
.login-left {
|
||
width: 50%;
|
||
}
|
||
|
||
.login-right {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 50%;
|
||
height: 100%;
|
||
|
||
.login-right-title {
|
||
font-size: 32px;
|
||
font-weight: 600;
|
||
margin-bottom: 32px;
|
||
}
|
||
}
|
||
|
||
.login-card {
|
||
width: 440px;
|
||
height: 490px;
|
||
border-radius: 15px;
|
||
box-shadow: 0 2px 8px 0 rgba(0, 0, 0, .08);
|
||
|
||
.login-card-span {
|
||
color: #999ba1;
|
||
font-size: 12px;
|
||
}
|
||
|
||
.login-tab-span {
|
||
font-weight: bolder;
|
||
font-size: large
|
||
}
|
||
|
||
.login-form-input {
|
||
|
||
}
|
||
|
||
.login-form-item {
|
||
height: 70px;
|
||
}
|
||
|
||
.login-form-button {
|
||
width: 100%;
|
||
}
|
||
|
||
.login-right-qrcode {
|
||
position: absolute;
|
||
right: 0;
|
||
top: 0;
|
||
background-position: 50%;
|
||
background-size: cover;
|
||
background-repeat: no-repeat;
|
||
width: 72px;
|
||
height: 72px;
|
||
background-image: url(data:image/png;base64,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);
|
||
cursor: pointer;
|
||
}
|
||
|
||
.login-right-qrcode:hover {
|
||
opacity: 0.9;
|
||
}
|
||
|
||
.login-form-bottom-button {
|
||
color: #999ba1;
|
||
}
|
||
}
|
||
|
||
}
|