UX: Signup form labels were too constrained, minor cleanup

This commit is contained in:
Kris
2019-02-13 21:07:34 -05:00
parent 53d592ad3b
commit 37666c3d18
3 changed files with 9 additions and 25 deletions

View File

@ -17,7 +17,7 @@
width: 100%; width: 100%;
} }
a { a {
color: dark-light-choose($primary-high, $secondary-low); color: $primary-high;
} }
td { td {
padding-right: 5px; padding-right: 5px;
@ -33,9 +33,6 @@
cursor: pointer; cursor: pointer;
} }
$label-width: 92px;
$input-width: 220px;
.login-modal, .login-modal,
.create-account { .create-account {
tr { tr {
@ -61,25 +58,13 @@ $input-width: 220px;
} }
.create-account { .create-account {
table {
td.label {
width: $label-width;
}
td input {
width: $input-width;
}
}
.disclaimer { .disclaimer {
color: dark-light-choose($primary-medium, $secondary-medium); color: $primary-medium;
margin-top: 0.5em; margin-top: 0.5em;
} }
.user-field { .user-field {
> label { > label {
width: $label-width;
float: left;
margin-top: 0.75em; margin-top: 0.75em;
margin-bottom: 0; margin-bottom: 0;
padding-top: 5px; padding-top: 5px;
@ -99,7 +84,6 @@ $input-width: 220px;
.controls { .controls {
padding-top: 5px; padding-top: 5px;
margin-left: $label-width;
label { label {
width: auto; width: auto;
text-align: left; text-align: left;
@ -107,18 +91,17 @@ $input-width: 220px;
} }
.instructions { .instructions {
margin-top: 0.15em; margin-top: 0.15em;
color: dark-light-choose($primary-medium, $secondary-medium); color: $primary-medium;
line-height: $line-height-medium; line-height: $line-height-medium;
} }
} }
clear: both;
} }
} }
.password-reset { .password-reset {
.instructions { .instructions {
label { label {
color: dark-light-choose($primary-medium, $secondary-medium); color: $primary-medium;
} }
} }
} }
@ -150,7 +133,7 @@ $input-width: 220px;
margin-bottom: 10px; margin-bottom: 10px;
} }
.instructions { .instructions {
color: dark-light-choose($primary-medium, $secondary-medium); color: $primary-medium;
margin: 0; margin: 0;
font-size: $font-down-1; font-size: $font-down-1;
font-weight: normal; font-weight: normal;
@ -171,7 +154,7 @@ $input-width: 220px;
flex-direction: column; flex-direction: column;
margin-top: 0.15em; margin-top: 0.15em;
label { label {
color: dark-light-choose($primary-medium, $secondary-medium); color: $primary-medium;
} }
} }
@ -180,5 +163,5 @@ $input-width: 220px;
button#login-link, button#login-link,
button#new-account-link { button#new-account-link {
background: transparent; background: transparent;
color: dark-light-choose($primary-high, $secondary-low); color: $primary-high;
} }

View File

@ -129,6 +129,7 @@
padding: 15px; padding: 15px;
margin-bottom: 5px; margin-bottom: 5px;
max-height: 475px; max-height: 475px;
max-width: 350px;
@media screen and (max-height: 768px) { @media screen and (max-height: 768px) {
max-height: 60vh; max-height: 60vh;
} }

View File

@ -20,7 +20,7 @@
margin-left: -2%; margin-left: -2%;
button { button {
flex: 1 1 48%; flex: 1 1 47%;
max-width: 70%; max-width: 70%;
margin: 1% 0 1% 2%; margin: 1% 0 1% 2%;
font-size: $font-up-1; font-size: $font-up-1;