Carbon/src/sass/login.sass

74 lines
1.2 KiB
Sass

@use "./base"
@use "./loading.sass"
@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, 450px)
padding: max(1rem,3vw) 2rem
margin: 8px
box-shadow: 0px 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
.form-feedback
width: 100%
margin: -0.5em 0 -0.8em
.form-error
color: red
input, button
font-family: inherit
font-size: 17px
background-color: c.$mild
color: #eee
width: 100%
border-radius: 5px
box-sizing: border-box
transition: background-color 0.15s ease-out, border-color 0.15s ease-out
padding: 4px 9px
border: 0px
input[type="text"],input[type="password"]
border: 3px solid transparent
margin: 0.4em 0px
&:hover, &:focus
border-color: c.$milder
button, input[type="submit"]
padding: 7px
&:hover
background-color: c.$milder
label
font-size: 18px