Move password exclude-ambiguous checkbox to its own row

The checkbox was crammed into the controls flex row alongside the
length/charset/generate button, causing layout issues at narrower
widths. Now sits on its own line between controls and output box
on both the main page and standalone /tools page.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Leopere 2026-02-08 16:49:28 -05:00
parent b7bff60271
commit b39bf68f06
Signed by: colin
SSH Key Fingerprint: SHA256:nRPCQTeMFLdGytxRQmPVK9VXY3/ePKQ5lGRyJhT5DY8
2 changed files with 8 additions and 12 deletions

View File

@ -429,14 +429,12 @@
<option value="hex">Hex</option>
</select>
</div>
<div class="field" style="display:flex;align-items:flex-end;gap:0.5rem;">
<label class="toggle-label" for="pw-no-ambiguous" style="text-transform:none;white-space:nowrap;cursor:pointer;display:flex;align-items:center;gap:0.4rem;">
<input type="checkbox" id="pw-no-ambiguous" checked>
Exclude ambiguous <code style="font-size:0.8em;opacity:0.7;">0 O o I l 1 |</code>
</label>
</div>
<button id="btn-password" class="btn-primary">Generate</button>
</div>
<label for="pw-no-ambiguous" style="display:flex;align-items:center;gap:0.5rem;font-size:0.85rem;color:var(--date-color);cursor:pointer;margin:-0.5rem 0 0;">
<input type="checkbox" id="pw-no-ambiguous" checked style="width:auto;">
Exclude ambiguous <code style="font-size:0.8em;opacity:0.7;">0 O o I l 1 |</code>
</label>
</div>
<div class="tools-section">

View File

@ -169,14 +169,12 @@
<option value="hex">Hex</option>
</select>
</div>
<div class="field" style="display:flex;align-items:flex-end;gap:0.5rem;">
<label for="pw-no-ambiguous" style="text-transform:none;white-space:nowrap;cursor:pointer;display:flex;align-items:center;gap:0.4rem;">
<input type="checkbox" id="pw-no-ambiguous" checked>
Exclude ambiguous <code style="font-size:0.8em;opacity:0.7;">0 O o I l 1 |</code>
</label>
</div>
<button id="btn-password" class="btn-primary">Generate</button>
</div>
<label for="pw-no-ambiguous" style="display:flex;align-items:center;gap:0.5rem;font-size:0.85rem;color:var(--date-color);cursor:pointer;margin:-0.5rem 0 0.75rem;">
<input type="checkbox" id="pw-no-ambiguous" checked style="width:auto;">
Exclude ambiguous <code style="font-size:0.8em;opacity:0.7;">0 O o I l 1 |</code>
</label>
<div class="output copyable" id="out-password" title="Click to copy">Generate a password...</div>
</div>