2020-10-20 18:22:13 +00:00
|
|
|
@use "./base"
|
2020-10-24 18:56:03 +00:00
|
|
|
@use "./loading.sass"
|
2020-10-20 18:22:13 +00:00
|
|
|
@use "./colors.sass" as c
|
|
|
|
|
2020-10-24 18:56:03 +00:00
|
|
|
|
2020-10-20 18:22:13 +00:00
|
|
|
.main
|
|
|
|
justify-content: center
|
|
|
|
align-items: center
|
|
|
|
|
|
|
|
.center-login-container
|
|
|
|
display: flex
|
|
|
|
flex-flow: column
|
|
|
|
justify-content: center
|
|
|
|
align-items: center
|
2020-10-21 06:33:36 +00:00
|
|
|
width: min(100vw, 450px)
|
2020-10-20 18:22:13 +00:00
|
|
|
padding: max(1rem,3vw) 2rem
|
2020-10-21 06:33:36 +00:00
|
|
|
margin: 8px
|
|
|
|
box-shadow: 0px 2px 10px c.$darkest
|
2020-10-20 18:22:13 +00:00
|
|
|
background-color: c.$darker
|
|
|
|
border-radius: 5px
|
|
|
|
|
|
|
|
.login-form
|
|
|
|
align-items: center
|
|
|
|
flex: 1 1 auto
|
|
|
|
width: 100%
|
|
|
|
display: flex
|
|
|
|
justify-content: space-around
|
|
|
|
flex-flow: column
|
|
|
|
|
|
|
|
.data-input
|
|
|
|
width: 100%
|
2020-10-21 05:23:44 +00:00
|
|
|
|
2020-10-20 18:22:13 +00:00
|
|
|
.form-input-container
|
|
|
|
width: 100%
|
|
|
|
display: flex
|
|
|
|
flex-direction: column
|
|
|
|
margin: 1em 0
|
|
|
|
|
2020-10-21 07:23:51 +00:00
|
|
|
.form-feedback
|
|
|
|
width: 100%
|
|
|
|
margin: -0.5em 0 -0.8em
|
|
|
|
|
2020-10-21 17:22:23 +00:00
|
|
|
.form-error
|
|
|
|
color: red
|
|
|
|
|
2020-10-21 07:23:51 +00:00
|
|
|
|
2020-10-21 06:33:36 +00:00
|
|
|
input, button
|
|
|
|
font-family: inherit
|
|
|
|
font-size: 17px
|
|
|
|
background-color: c.$mild
|
|
|
|
color: #eee
|
2020-10-20 18:22:13 +00:00
|
|
|
width: 100%
|
|
|
|
border-radius: 5px
|
|
|
|
box-sizing: border-box
|
2020-10-21 06:33:36 +00:00
|
|
|
transition: background-color 0.15s ease-out, border-color 0.15s ease-out
|
|
|
|
padding: 4px 9px
|
2020-10-20 18:22:13 +00:00
|
|
|
border: 0px
|
|
|
|
|
|
|
|
input[type="text"],input[type="password"]
|
|
|
|
border: 3px solid transparent
|
|
|
|
margin: 0.4em 0px
|
|
|
|
|
2020-10-21 06:33:36 +00:00
|
|
|
&:hover, &:focus
|
|
|
|
border-color: c.$milder
|
|
|
|
|
|
|
|
button, input[type="submit"]
|
|
|
|
padding: 7px
|
|
|
|
|
|
|
|
&:hover
|
|
|
|
background-color: c.$milder
|
2020-10-20 18:22:13 +00:00
|
|
|
|
|
|
|
label
|
2020-10-21 06:33:36 +00:00
|
|
|
font-size: 18px
|