57 lines
1005 B
Sass
57 lines
1005 B
Sass
@use "./base"
|
|
@use "./colors.sass" as c
|
|
|
|
.main
|
|
justify-content: center
|
|
align-items: center
|
|
|
|
.center-login-container
|
|
display: flex
|
|
flex-flow: column
|
|
justify-content: center
|
|
align-items: center
|
|
width: min(100vw, 30rem)
|
|
padding: max(1rem,3vw) 2rem
|
|
height: 27rem
|
|
box-shadow: -2px 2px 10px c.$darkest
|
|
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%
|
|
|
|
.form-input-container
|
|
width: 100%
|
|
display: flex
|
|
flex-direction: column
|
|
margin: 1em 0
|
|
|
|
input
|
|
width: 100%
|
|
height: 2.4rem
|
|
border-radius: 5px
|
|
box-sizing: border-box
|
|
transition: background-color 1s, border-color 1s
|
|
padding: 0px 1ch
|
|
border: 0px
|
|
|
|
input[type="text"],input[type="password"]
|
|
border: 3px solid transparent
|
|
margin: 0.4em 0px
|
|
&:hover
|
|
border-color: c.$mild
|
|
|
|
input[type="submit"]:hover
|
|
background-color: c.$mild
|
|
|
|
label
|
|
font-size: 1.2em
|