Form grid,

some more error states
This commit is contained in:
Andrew Croce
2018-07-25 10:23:31 -04:00
parent 8ea1fd6565
commit fbec69f110
2 changed files with 72 additions and 14 deletions

View File

@@ -41,10 +41,22 @@
border-color: $state-color;
border-width: $border-width;
}
fieldset {
input[type='radio'] {
+ label::before {
box-shadow: 0 0 0 1px #ffffff, 0 0 0 3px $color-red;
}
}
}
}
.usa-input {
margin: ($gap * 4) 0;
margin: ($gap * 4) ($gap * 2) ($gap * 4) 0;
@includ media($medium-screen) {
margin: ($gap * 4) 0;
}
label {
padding: 0 0 $gap 0;
@@ -80,6 +92,10 @@
legend {
padding: 0 0 $gap 0;
@include h4;
.icon {
vertical-align: middle;
}
}
label {
@@ -150,3 +166,32 @@ select {
}
}
// Form Grid
.form-row {
margin: ($gap * 4) 0;
.form-col {
flex-grow: 1;
&:first-child .usa-input {
margin-top: 0;
}
&:last-child .usa-input {
margin-bottom: 0;
}
}
@include media($medium-screen) {
@include grid-row;
align-items: flex-start;
.form-col {
.usa-input {
margin: 0 ($gap * 4) 0 0;
}
}
}
}