Paolo Possanzini
142 lines
2.8 KiB
Plaintext
142 lines
2.8 KiB
Plaintext
// main: ../style.less
|
|
@import "grid-system.less";
|
|
@import "colors.less";
|
|
@import "fonts.less";
|
|
|
|
@modal: modal;
|
|
@login: login;
|
|
@loader: loader;
|
|
@backdrop: backdrop;
|
|
@font-family: 'Work Sans', sans-serif;
|
|
|
|
@modal-min-width: 500px;
|
|
@modal-min-height: 400px;
|
|
|
|
@modal-header-height: 64px;
|
|
|
|
@modal-login-height: 560px;
|
|
@modal-login-width: 600px;
|
|
@modal-login-top: @modal-login-height /2;
|
|
@modal-login-left: @modal-login-width /2;
|
|
|
|
|
|
@modal-loader-height: 392px;
|
|
@modal-loader-width: 896px;
|
|
@modal-loader-top: @modal-loader-height /2;
|
|
@modal-loader-left: @modal-loader-width /2;
|
|
|
|
@progress-back-color: #1791ff;
|
|
@progress-white-color: #fff;
|
|
|
|
|
|
.@{modal} {
|
|
min-width: @modal-min-width;
|
|
height: @modal-min-height;
|
|
box-shadow: @shadows;
|
|
z-index: 1000;
|
|
background-color: @color-background-white;
|
|
position: absolute;
|
|
|
|
header {
|
|
height: @modal-header-height;
|
|
line-height:@modal-header-height;
|
|
}
|
|
}
|
|
|
|
.@{modal}.@{login} {
|
|
width: @modal-login-width;
|
|
height: @modal-login-height;
|
|
top: calc(~'50%' - @modal-login-height /2 );
|
|
left: calc(~'50%' - @modal-login-width /2 );
|
|
|
|
header {
|
|
background-color: @color-darkish-blue;
|
|
color: @color-white;
|
|
font-family: @font-family;
|
|
font-weight: 600;
|
|
font-size: 24px;
|
|
text-align: left;
|
|
padding: 0px 23px;
|
|
|
|
}
|
|
}
|
|
|
|
.@{modal}.@{loader} {
|
|
width: @modal-loader-width;
|
|
height: @modal-loader-height;
|
|
top: calc(~'50%' - @modal-loader-height /2 );
|
|
left: calc(~'50%' - @modal-loader-width /2 );
|
|
|
|
header {
|
|
background-color: @color-darkish-blue;
|
|
color: @color-white;
|
|
font-family: @font-family;
|
|
font-weight: 600;
|
|
font-size: 24px;
|
|
text-align: left;
|
|
padding: 0px 23px;
|
|
}
|
|
|
|
h2{
|
|
font-size: 18px;
|
|
text-align: left;
|
|
color:@color-input-light;
|
|
width: 592px;
|
|
margin: auto;
|
|
margin-top: 76px;
|
|
margin-bottom: 76px;
|
|
}
|
|
|
|
.progress-line{
|
|
height: 30px;
|
|
width: 592px;
|
|
margin: auto;
|
|
|
|
i{
|
|
// width: 25px;
|
|
// height: 25px;
|
|
font-size: 25px;
|
|
margin-right: 15px;
|
|
display: block;
|
|
float: left;
|
|
color: @progress-back-color;
|
|
}
|
|
|
|
progress{
|
|
width: 552px;
|
|
height: 24px;
|
|
font-size: 14px;
|
|
float: left;
|
|
background-color: white;
|
|
|
|
// color: @progress-white-color;
|
|
}
|
|
|
|
progress[value]::-webkit-progress-value {
|
|
color: @progress-white-color;
|
|
background-color: @progress-back-color;
|
|
border-radius: 12px;
|
|
}
|
|
|
|
progress[value]::-webkit-progress-bar {
|
|
background-color: #fff;
|
|
border-radius: 12px;
|
|
box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5);
|
|
}
|
|
}
|
|
}
|
|
|
|
.@{backdrop} {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
width: 100vw;
|
|
height: 100vh;
|
|
overflow: hidden;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
background-color: @color-backdrop;
|
|
z-index: 900;
|
|
}
|