Making a note of this because trying to fix it has turned into a bit of a rabbit hole.
Checkbox fields in forms are rendering out of alignment from the rest of the form:
Our checkbox fields aren't structured in the way Bootstrap is expecting them to be. Bootstrap expects:
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<div class="checkbox">
<label>
<input type="checkbox"> Remember me
</label>
</div>
</div>
</div>While our checkbox renderer in https://github.com/emfcamp/Website/blob/main/templates/_formhelpers.html#L170 is providing this:
<div class="form-group">
<div class="col-md-9 col-sm-offset-3">
<label class="checkbox">
<input id="needs_help" name="needs_help" type="checkbox" value="y">
I'd like advice or help with this proposal
</label>
</div>
</div>If I update it to that and then poke the CSS a bit then I can get something that looks, if not perfect, at least better than it did.
The rabbit hole here is that use of the form helpers is hit and miss at best - the CFP for example doesn't use them at all and just dumps the form fields directly into the template with hand written HTML surrounding them. It's entirely possible to resolve that either by rewriting that HTML to have the correct structure, or using form helpers in its place. I'd like to discuss what the preferred pattern is before going any further on this.
The other option, which is pretty hideous, is to add a class to form helper rendered checkboxes and scope the CSS to that class so that we at least don't make the CFP form any worse than it is.
Making a note of this because trying to fix it has turned into a bit of a rabbit hole.
Checkbox fields in forms are rendering out of alignment from the rest of the form:
Our checkbox fields aren't structured in the way Bootstrap is expecting them to be. Bootstrap expects:
While our checkbox renderer in https://github.com/emfcamp/Website/blob/main/templates/_formhelpers.html#L170 is providing this:
If I update it to that and then poke the CSS a bit then I can get something that looks, if not perfect, at least better than it did.
The rabbit hole here is that use of the form helpers is hit and miss at best - the CFP for example doesn't use them at all and just dumps the form fields directly into the template with hand written HTML surrounding them. It's entirely possible to resolve that either by rewriting that HTML to have the correct structure, or using form helpers in its place. I'd like to discuss what the preferred pattern is before going any further on this.
The other option, which is pretty hideous, is to add a class to form helper rendered checkboxes and scope the CSS to that class so that we at least don't make the CFP form any worse than it is.