Uswds: Checkbox hidden when label & input order flipped

[noonkay]

Description
I'm generating forms with Django and the default format that is rendered has <label> followed by <input> which works beautifully with textfields but not so with checkboxes. The label shows up but the checkbox is hidden. The only way I can make it show up is to write a custom form only to flip the order of those elements to match your documentation.

Ask
Revise the checkbox styling to work more dynamically, regardless of the order of <label> and <input> siblings.

[maya]

Hi @noonkay, thanks for opening this. I'll bring this up to the team and see what we can do.

[juliaelman]

@noonkay thanks for opening this issue! Did you implement the Standards using npm, the downloadable zip file or with https://github.com/department-of-veterans-affairs/django-designstandards?

[noonkay]

Thanks for looking into it @juliaelman We were using VA's django module for the design standards. I believe the npm package wasn't yet available at the time.

[maya]

This is bc we specify the label pseudo selector after the input in the CSS.

input[type="checkbox"] + label::before, input[type="radio"] + label::before

[paultag]

I saw this too, I thought I had a bug in my code, until I noticed the labels were after the input in the example. It'd be nice to get this fixed!

[maya]

Doesn't look like this will be possible, closing.