blob: 5e75bcca1b1004a2e6d2c357d6b98ce86e785c33 [file] [log] [blame]
Michael Daviscb8bb192017-02-09 15:45:13 -06001label, 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
Yoshie Muranakae4194ce2019-05-24 14:33:56 -050013.label__helper-text {
14 color: $darkgrey;
15 line-height: 1.2;
16 font-size: 0.9em;
17 margin-bottom: 0.4em;
18}
19
Michael Daviscb8bb192017-02-09 15:45:13 -060020input[type='email'],
21input[type='number'],
22input[type='password'],
23input[type='search'],
24input[type='tel'],
25input[type='url'],
26input[type='text'],
Yoshie Muranaka5bd1dec2019-05-16 13:06:32 -050027input[type='date'],
28input[type='time'],
Michael Daviscb8bb192017-02-09 15:45:13 -060029textarea {
30 border-radius: 0px;
Michael Davis4ac71d42017-06-19 14:47:50 -050031 border: 1px solid $input-border;
beccabroeka09cc2d2019-01-23 14:26:55 -060032 margin: 0;
Michael Davise15a9562017-03-03 14:30:24 -060033 background: $white;
34 box-shadow: 0 0 0;
35 transition: none !important;
Yoshie Muranaka5bd1dec2019-05-16 13:06:32 -050036 max-height: 2.1em;
Michael Daviscb8bb192017-02-09 15:45:13 -060037 &:focus {
Michael Davis19ac8f82017-05-08 11:20:12 -050038 border-color: $medgrey;
beccabroeka09cc2d2019-01-23 14:26:55 -060039 box-shadow: 0 -3px $field__focus inset;
Michael Daviscb8bb192017-02-09 15:45:13 -060040 }
Michael Davis51946552017-05-01 10:30:38 -050041 &:disabled,
42 .disabled {
Michael Daviscb8bb192017-02-09 15:45:13 -060043 background: $field__disabled;
44 border: 1px solid $lightbg__grey;
45 }
46 &.input__error {
Michael Davis51946552017-05-01 10:30:38 -050047 box-shadow: 0 -5px $error-color inset;
48 color: $error-color;
49 &:focus {
50 box-shadow: 0 -5px $field__focus inset;
51 }
Michael Daviscb8bb192017-02-09 15:45:13 -060052 }
53}
54
beccabroeka09cc2d2019-01-23 14:26:55 -060055//input validation
56.ng-invalid.ng-touched {
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.submitted .ng-invalid {
64 box-shadow: 0 -3px $error-color inset;
65 &:focus {
66 border-color: $medgrey;
67 box-shadow: 0 -3px $error-color inset;
68 }
69}
70
71.form-error {
72 margin-bottom: .7em;
73 font-size: 0.8rem;
74 color: #c60f13;
75 height:1rem;
76 display: block;
77 visibility: hidden;
78 .visible {
79 visibility: visible;
80 }
81}
Michael Davis4ac71d42017-06-19 14:47:50 -050082//Foundation overwrite
83[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 {
84 border-color: $input-border;
85}
86
Michael Davis51946552017-05-01 10:30:38 -050087input[readonly],
88input[readonly]:focus{
89 box-shadow: 0 0 0;
90 background: $field__disabled;
91 border: 1px solid $lightbg__grey;
92}
93
Michael Daviscb8bb192017-02-09 15:45:13 -060094textarea { padding: .2em;
95 height: auto;}
Iftekharul Islamf157d372017-03-08 11:11:27 -060096input[type="submit"], .submit {
Michael Daviscb8bb192017-02-09 15:45:13 -060097 margin: 1em 0;
98 width: 100%;
99}
100
101//Custom select
102select{
103 border-radius: 0px;
Yoshie Muranakade382082019-04-30 13:56:10 -0500104 height: auto;
105 padding-right: 0.5rem; //override inherited Foundation style
Yoshie Muranaka5bd1dec2019-05-16 13:06:32 -0500106 border-color: $input-border;
Michael Daviscb8bb192017-02-09 15:45:13 -0600107 @include fastTransition-all;
108 @include bgImage__arrowDown-primary;
109 &:focus {
Michael Daviscb8bb192017-02-09 15:45:13 -0600110 box-shadow: 0 0 0;
111 }
Yoshie Muranakade382082019-04-30 13:56:10 -0500112 &[disabled] {
113 @include bgImage__arrowDown-disabled;
114 }
Michael Daviscb8bb192017-02-09 15:45:13 -0600115}
Yoshie Muranaka5bd1dec2019-05-16 13:06:32 -0500116
117#login__form {
118 input {
119 height: 3em;
120 max-height: none;
121 }
122}
Yoshie Muranakae4194ce2019-05-24 14:33:56 -0500123.form__validation-message {
124 color: $error-color;
125 font-size: 0.9em;
126}