104 lines
2.0 KiB
SCSS
104 lines
2.0 KiB
SCSS
.login-container {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow-y: auto;
|
|
background: url("@/assets/images/login-background-light.jpg") no-repeat center
|
|
right;
|
|
|
|
.login-content {
|
|
display: flex;
|
|
width: 100%;
|
|
min-width: 400px;
|
|
max-width: 850px;
|
|
overflow: hidden;
|
|
background-color: #fff;
|
|
border-radius: 5px;
|
|
box-shadow: var(--el-box-shadow-light);
|
|
|
|
@media (width <= 768px) {
|
|
flex-direction: column;
|
|
max-width: 100%;
|
|
height: 100vh;
|
|
border-radius: 0;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.login-image {
|
|
display: flex;
|
|
flex: 3;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: linear-gradient(60deg, #165dff, #6aa1ff);
|
|
|
|
@media (width <= 768px) {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.login-box {
|
|
display: flex;
|
|
flex: 2;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
min-width: 400px;
|
|
padding: 30px;
|
|
|
|
@media (width <= 768px) {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.input-wrapper {
|
|
display: flex;
|
|
align-items: center;
|
|
width: 100%;
|
|
}
|
|
|
|
.captcha-image {
|
|
height: 48px;
|
|
cursor: pointer;
|
|
border-top-right-radius: 6px;
|
|
border-bottom-right-radius: 6px;
|
|
}
|
|
}
|
|
|
|
.el-form-item {
|
|
background: var(--el-input-bg-color);
|
|
border: 1px solid var(--el-border-color);
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.el-input {
|
|
.el-input__wrapper {
|
|
padding: 0;
|
|
background-color: transparent;
|
|
box-shadow: none;
|
|
|
|
&.is-focus,
|
|
&:hover {
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
input:-webkit-autofill {
|
|
/* 通过延时渲染背景色变相去除背景颜色 */
|
|
transition: background-color 1000s ease-in-out 0s;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
html.dark {
|
|
.login-container {
|
|
background: url("@/assets/images/login-background-dark.jpg") no-repeat
|
|
center right;
|
|
|
|
.login-content {
|
|
background: transparent;
|
|
box-shadow: var(--el-box-shadow);
|
|
}
|
|
}
|
|
}
|