1label, legend { 2 font-size:1em; 3 font-weight: 300; 4 margin: 0; 5 &.disabled { 6 color: $lightbg__grey; 7 } 8 .error { 9 font-size: .9em; 10 } 11} 12 13input[type='email'], 14input[type='number'], 15input[type='password'], 16input[type='search'], 17input[type='tel'], 18input[type='url'], 19input[type='text'], 20input[type='date'], 21input[type='time'], 22textarea { 23 border-radius: 0px; 24 border: 1px solid $input-border; 25 margin: 0; 26 background: $white; 27 box-shadow: 0 0 0; 28 transition: none !important; 29 max-height: 2.1em; 30 &:focus { 31 border-color: $medgrey; 32 box-shadow: 0 -3px $field__focus inset; 33 } 34 &:disabled, 35 .disabled { 36 background: $field__disabled; 37 border: 1px solid $lightbg__grey; 38 } 39 &.input__error { 40 box-shadow: 0 -5px $error-color inset; 41 color: $error-color; 42 &:focus { 43 box-shadow: 0 -5px $field__focus inset; 44 } 45 } 46} 47 48//input validation 49.ng-invalid.ng-touched { 50 box-shadow: 0 -3px $error-color inset; 51 &:focus { 52 border-color: $medgrey; 53 box-shadow: 0 -3px $error-color inset; 54 } 55} 56.submitted .ng-invalid { 57 box-shadow: 0 -3px $error-color inset; 58 &:focus { 59 border-color: $medgrey; 60 box-shadow: 0 -3px $error-color inset; 61 } 62} 63 64.form-error { 65 margin-bottom: .7em; 66 font-size: 0.8rem; 67 color: #c60f13; 68 height:1rem; 69 display: block; 70 visibility: hidden; 71 .visible { 72 visibility: visible; 73 } 74} 75//Foundation overwrite 76[type=color], [type=date], [type=datetime-local], [type=datetime], [type=email], [type=month], [type=number], [type=password], [type=search], [type=tel], [type=text], [type=time], [type=url], [type=week], textarea { 77 border-color: $input-border; 78} 79 80input[readonly], 81input[readonly]:focus{ 82 box-shadow: 0 0 0; 83 background: $field__disabled; 84 border: 1px solid $lightbg__grey; 85} 86 87textarea { padding: .2em; 88 height: auto;} 89input[type="submit"], .submit { 90 margin: 1em 0; 91 width: 100%; 92} 93 94//Custom select 95select{ 96 border-radius: 0px; 97 height: auto; 98 padding-right: 0.5rem; //override inherited Foundation style 99 border-color: $input-border; 100 @include fastTransition-all; 101 @include bgImage__arrowDown-primary; 102 &:focus { 103 box-shadow: 0 0 0; 104 } 105 &[disabled] { 106 @include bgImage__arrowDown-disabled; 107 } 108} 109 110#login__form { 111 input { 112 height: 3em; 113 max-height: none; 114 } 115} 116