133 lines
2.2 KiB
SCSS

.login-form {
position: relative;
transform: scale(1);
width: 540px;
min-width: 100%;
top: 0;
right: 0;
padding: 16%;
text-align: center;
background-color: rgba(255, 255, 255, 1);
border-radius: 0px;
@media all and (max-height: 900px), (max-width: 1400px) {
width: 420px;
min-width: 420px;
}
.mat-title {
margin: 10px 0 40px 0;
text-indent: -10000000px;
width: 160px;
height: 160px;
// background-image: url(/assets/images/logo/bg_login_w160.png);
background-repeat: no-repeat;
display: inline-flex;
background-size: 100% auto;
flex: 1 1 auto;
@media all and (max-height: 900px), (max-width: 1400px) {
width: 140px;
min-width: 140px;
margin: 10px 0 10px 0;
}
}
form {
width: 100%;
text-align: left;
mat-form-field {
width: 100%;
}
mat-checkbox {
margin: 0;
}
.remember-forgot-password {
font-size: 13px;
.remember-me {
}
.auto-login {
font-size: 13px;
font-weight: 600;
margin-bottom: 2vh;
}
}
.submit-button {
width: 100%;
margin: 0 auto;
margin: 2vh 0 1.6vh;
display: block;
}
}
.register {
margin: 32px auto 24px auto;
font-weight: 600;
.text {
margin-right: 8px;
}
}
.separator {
font-size: 15px;
font-weight: 600;
margin: 24px auto;
position: relative;
overflow: hidden;
width: 100px;
.text {
display: inline-flex;
position: relative;
padding: 0 8px;
z-index: 9999;
&:before,
&:after {
content: '';
display: block;
width: 30px;
position: absolute;
top: 10px;
border-top: 1px solid;
}
&:before {
right: 100%;
}
&:after {
left: 100%;
}
}
}
.policy {
position: absolute;
bottom: 5vh;
display: block;
text-align: center;
opacity: 0.7;
padding: 6px;
border-radius: 100px;
width: 68%;
color: #2d3a4a;
&:hover {
opacity: 1;
}
}
button {
&.google,
&.facebook {
width: 192px;
text-transform: none;
color: #ffffff;
font-size: 13px;
}
}
}