Get things into a somewhat working state on the login form

This commit is contained in:
Dane Everitt 2018-03-31 15:52:11 -05:00
parent 7de2c8684c
commit 791cbaa5ce
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
15 changed files with 450 additions and 132 deletions

View file

@ -0,0 +1,37 @@
.input-open {
@apply .w-full .px-3 .relative;
}
.input-open > .input {
@apply .appearance-none .block .w-full .text-grey-darker .border-b-2 .border-grey-light .py-3 .mb-3;
&:focus {
@apply .border-blue;
outline: 0;
transition: border 500ms ease-out;
}
&:focus + label, &:valid + label {
@apply .text-grey-darker .px-0 .cursor-pointer;
transform:translateY(-24px)
}
&:invalid + label {
@apply .text-grey .px-1;
transform:translateY(0)
}
&:required {
box-shadow: none;
}
}
.input-open > label {
@apply .block .uppercase .tracking-wide .text-grey .text-xs .mb-2 .absolute .px-1;
top: 14px;
transition: transform 200ms ease-out;
}
.login-box {
@apply .bg-white .shadow-lg .rounded-lg .pt-10 .px-8 .pb-6 .mb-4;
}