argos/dmp-frontend/src/app/user-management/login/login.component.scss

151 lines
2.4 KiB
SCSS
Raw Normal View History

2017-12-19 18:34:00 +01:00
.container{
padding: 15px 30px;
}
.card{
box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.14);
border-radius: 6px;
color: rgba(0,0,0, 0.87);
background: #fff;
}
.card-raised{
box-shadow: 0 10px 30px -12px rgba(0, 0, 0, 0.42), 0 4px 25px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
}
.page-title{
margin-top: 40px;
}
@media (min-width: 1200px) {
.container {
width: 100%;
}
}
@media (min-width: 992px) {
.container {
width: 100%;
}
}
@media (min-width: 768px) {
.container {
width: 100%;
}
}
2017-12-19 16:59:34 +01:00
.container{
height: 100%;
position: relative;
z-index: 1;
}
.card{
position: relative;
padding: 20px;
display: flex;
flex-direction: column;
align-items: center;
margin-top: 90px;
top: -90px;
-webkit-animation-name: card;
-moz-animation-name: card;
-o-animation-name: card;
animation-name: card;
-webkit-animation-duration: 600ms;
-moz-animation-duration: 600ms;
-o-animation-duration: 600ms;
animation-duration: 600ms;
-webkit-animation-fill-mode: forwards;
-moz-animation-fill-mode: forwards;
-o-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
@-webkit-keyframes card {
from {top: -40px;}
to {top: 0;}
}
@keyframes card {
from {top: -40px;}
to {top: 0;}
}
.card-header{
position: relative;
overflow: hidden;
top: -40px;
width: 100%;
padding: 25px;
border-radius: 3px;
background: linear-gradient(60deg, #ec407a, #d81b60);
box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(233, 30, 99, 0.4);
display: flex;
flex-direction: column;
align-items: center;
}
.card-header h4{
font-weight: 400;
color: #fff;
margin-bottom: 25px;
margin-top: 5px;
}
.social-btns i{
font-size: 21px;
color: #fff;
}
.social-btns button{
margin: 0 8px;
}
.tip{
margin-top: -20px;
}
.form-row, .card-form, .mat-input-container{
width: 100%;
}
.card-form{
padding: 5px;
}
.form-row{
position: relative;
display: flex;
align-items: center;
margin-top: 13px;
}
.form-row i{
position: relative;
top: -5px;
margin-right: 15px;
color: #555;
}
.card-footer{
margin: 10px;
}
.card-footer button{
color: #e91e63;
2018-02-23 11:41:39 +01:00
}
.btn span.icon {
background: url(img/b2access_small.png) no-repeat;
float: left;
width: 45px;
height: 25px;
}
2018-02-23 12:09:25 +01:00
span.iconmedium {
2018-02-23 11:41:39 +01:00
background: url(img/b2access_medium.png) no-repeat;
float: left;
width: 100px;
height: 56px;
2017-12-19 16:59:34 +01:00
}