Improve accessibility by associating for with id instead of name

[plocket]

Closes #214. No rush on my part. I've tested it a bit myself to make sure basic behavior hasn't changed, though I don't think I have the tools I need to test the accessibility properly.

Not sure if we want to increment those package versions.

[nonprofittechy]

Just need to fix formatting; I'll merge that PR

[plocket]

I think Bryce wanted to test some things before merging this

[nonprofittechy]

I think Bryce wanted to test some things before merging this

I meant merge the PR from actions/Black, but that doesn't exist. Looks like we need to point to Bryce's new action in ALActions for formatting; the one this repo points to is broken.

[BryceStevenWilley]

Got to testing it out, and it does seem to associate the "Month" / "Day" / "Year" labels better with their inputs, so success! However, I think the conversation we started having in #164 comes into play too, as there are some issues with the original field label.

In Chromium, I get this error:

The label's for attribute doesn't match any element id. This might prevent the
browser from correctly autofilling the form and accessibility tools from working correctly.

To fix this issue, make sure the label's for attribute references the correct id of a form field.

which happens because we set that input to be hidden, so most accessibility tools won't include it as a part of the page's content, and will assume that the label points to nothing.

I think that we could make the whole widget a fieldset, with that label becoming the legend. I manually edited that HTML in the browser tools, and it's more clearly associated with the inputs, which is great, essentially just changing the div.da-field-container-datatype-ThreePartsDate to a fieldset, and changing the label tag to a legend. My HTML looks like this:

<fieldset class="da-container da-form-group row da-field-container da-field-container-datatype-ThreePartsDate">
    <legend for="ZGF0ZV9vZl9ncmFkdWF0aW9u" class="col-md-4 col-form-label da-form-label datext-right">
        When will your high school graduation be?
    </legend>
    <div class="col-md-8 dafieldpart">
        (unchanged)
        ...
</fieldset>

I'm not sure how much harder these changes would be; if you think they're a lot harder, we can merge this and take another shot at them later (and to be extra clear, these issues are also present in main, so there's nothing wrong with this PR). But if you think that it'd be easy to add while this is fresh in our minds, I think it'd be a significant improvement.

[plocket]

I'm not sure how much harder these [fieldset] changes would be; if you think they're a lot harder, we can merge this and take another shot at them later

I do believe the fieldset conversation is a more complex one and added to the discussion in #164. We should probably save it for a separate discussion and PR. Maybe a deep dive? I've added it to the list in the doc for whenever the next deep dive happens.

[BryceStevenWilley]

Let's get these improvements in while we discuss further in #164