2020-10-20 18:22:13 +00:00
|
|
|
@use "./base"
|
2020-10-30 11:55:19 +00:00
|
|
|
@use "./loading"
|
2020-10-30 11:45:44 +00:00
|
|
|
@use "./colors" as c
|
|
|
|
|
@use "./tippy"
|
2020-10-20 18:22:13 +00:00
|
|
|
|
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-11-01 16:35:10 +00:00
|
|
|
.homeserver-question
|
2020-11-01 16:57:19 +00:00
|
|
|
font-size: 0.8em
|
2020-10-30 11:45:44 +00:00
|
|
|
|
|
|
|
|
.homeserver-label
|
|
|
|
|
display: flex
|
|
|
|
|
justify-content: space-between
|
|
|
|
|
align-items: flex-end
|
|
|
|
|
|
|
|
|
|
.homeserver-popup
|
|
|
|
|
p
|
|
|
|
|
margin: 0.2em
|
|
|
|
|
a
|
|
|
|
|
&, &:hover, &:active
|
|
|
|
|
color: white
|
|
|
|
|
text-decoration: none
|
|
|
|
|
&:hover
|
|
|
|
|
color: #f00 //Placeholder
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
2020-10-21 07:23:51 +00:00
|
|
|
@keyframes spin
|
|
|
|
|
0%
|
|
|
|
|
transform: rotate(0deg)
|
|
|
|
|
100%
|
|
|
|
|
transform: rotate(180deg)
|
|
|
|
|
|
|
|
|
|
.loading-icon
|
|
|
|
|
display: inline-block
|
|
|
|
|
background-color: #ccc
|
|
|
|
|
width: 12px
|
|
|
|
|
height: 12px
|
|
|
|
|
margin-right: 6px
|
|
|
|
|
animation: spin 0.7s infinite
|
|
|
|
|
|
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
|
2020-10-23 16:04:02 +00:00
|
|
|
cursor: pointer
|
2020-10-21 06:33:36 +00:00
|
|
|
background-color: c.$milder
|
2020-10-20 18:22:13 +00:00
|
|
|
|
|
|
|
|
label
|
2020-10-21 06:33:36 +00:00
|
|
|
font-size: 18px
|
