Inline form should have <label> tags

[ajb]

<label> tags are required for all form inputs. Inline form is using placeholders only, which is a big no-no.

we should add the appropriate labels, with the .visuallyhidden class

[bensheldon]

Of note, healthcare.gov uses an explicit .accessibility class for its hidden elements:

.accessibility { 
  position:absolute!important;
  display:block!important;
  text-indent:-999em!important;
  border:none!important;
}

[ajb]

just committed the .visually-hidden. (it's in scaffolding.less)

uses a slightly different method... i'm obviously not tied to it -- i only learned of it an hour ago. if you determine healthcare.gov's is better, feel free to override.

[bensheldon]

Nah, just wanted to capture their reasoning. Though I do think there could be value to capturing that the intent is for accessibility and not some other kind of shim; we could alias .visually-hidden as .accessibility if this line of reasoning is compelling.

[ajb]

eh, both have their semantic downsides. maybe .screenreader-only?

easy enough to change this later with a global find/replace, anyway.

[ajb]

gonna go ahead and add this.