Tweak form layout

- Use boldface for labels
- Use the equivalent of h4 for the heading
- Indent checkbox/radio choices
This commit is contained in:
Jonas Schäfer
2021-01-27 16:32:21 +01:00
parent 2f368e0a34
commit 4d0ba8ef9a
2 changed files with 30 additions and 12 deletions

View File

@@ -145,14 +145,20 @@
<input type="text" id="fex-f1" name="fex-f1">
</div>
<div class="f-ebox">
<input type="checkbox" id="fex-f2" name="fex-f2"><label for="fex-f2">Enable fancy features</label>
<input type="checkbox" id="fex-f3" name="fex-f3"><label for="fex-f3">Enable more features</label>
<input type="checkbox" id="fex-f4" name="fex-f4"><label for="fex-f4">Also do that other thing</label>
<label>Optional features</label>
<ul id="check-features">
<li><input type="checkbox" id="fex-f2" name="fex-f2"><label for="fex-f2">Enable fancy features</label></li>
<li><input type="checkbox" id="fex-f3" name="fex-f3"><label for="fex-f3">Enable more features</label></li>
<li><input type="checkbox" id="fex-f4" name="fex-f4"><label for="fex-f4">Also do that other thing</label></li>
</ul>
</div>
<div class="f-ebox">
<input type="radio" id="fex-f5" name="fex-rg1"><label for="fex-f5">High difficulty</label>
<input type="radio" id="fex-f6" name="fex-rg1"><label for="fex-f6">Medium difficulty</label>
<input type="radio" id="fex-f7" name="fex-rg1"><label for="fex-f7">Low difficulty</label>
<label>Level</label>
<ul id="radio-difficulty">
<li><input type="radio" id="fex-f5" name="fex-rg1"><label for="fex-f5">High difficulty</label></li>
<li><input type="radio" id="fex-f6" name="fex-rg1"><label for="fex-f6">Medium difficulty</label></li>
<li><input type="radio" id="fex-f7" name="fex-rg1"><label for="fex-f7">Low difficulty</label></li>
</ul>
</div>
<div class="f-ebox">
<label for="fex-f8">Select dropdown:</label>