web: stop browser autofill on the name + master fields

The master and pass-overlay inputs are now type=text with a CSS visual mask
(-webkit-text-security) instead of type=password, so the browser never treats
them as password fields — no autofill, no save prompt, no 'suggest strong
password'. Added autocomplete=off + autocapitalize/autocorrect off and
data-1p-ignore / data-lpignore / data-bwignore on the name + master + pass.
This commit is contained in:
Oleksandr Kozachuk
2026-06-08 21:59:16 +02:00
parent d44a54002b
commit db0eb9ebc4
2 changed files with 8 additions and 3 deletions
+3 -3
View File
@@ -102,11 +102,11 @@
<div class="fields"> <div class="fields">
<div class="field"> <div class="field">
<label for="qname">Name (+ optional rules)</label> <label for="qname">Name (+ optional rules)</label>
<input type="text" id="qname" placeholder="github or github 20R 99 2024-01-01" autocomplete="off" spellcheck="false" autofocus /> <input type="text" id="qname" placeholder="github or github 20R 99 2024-01-01" autocomplete="off" autocapitalize="off" autocorrect="off" spellcheck="false" data-1p-ignore data-lpignore="true" data-bwignore="true" autofocus />
</div> </div>
<div class="field"> <div class="field">
<label for="master">Master password</label> <label for="master">Master password</label>
<input type="password" id="master" placeholder="your master phrase" autocomplete="off" /> <input type="text" id="master" class="mask" placeholder="your master phrase" autocomplete="off" autocapitalize="off" autocorrect="off" spellcheck="false" data-1p-ignore data-lpignore="true" data-bwignore="true" />
</div> </div>
</div> </div>
<div class="result"> <div class="result">
@@ -178,7 +178,7 @@
<p class="hint">Cache a master/parent password for this name (used by <code>enc</code> in its subtree). Kept in memory only.</p> <p class="hint">Cache a master/parent password for this name (used by <code>enc</code> in its subtree). Kept in memory only.</p>
<div class="field"> <div class="field">
<label for="passInput">Password</label> <label for="passInput">Password</label>
<input type="password" id="passInput" autocomplete="off" /> <input type="text" id="passInput" class="mask" autocomplete="off" autocapitalize="off" autocorrect="off" spellcheck="false" data-1p-ignore data-lpignore="true" data-bwignore="true" />
</div> </div>
<div class="row"> <div class="row">
<button class="btn" id="passOk">Set</button> <button class="btn" id="passOk">Set</button>
+5
View File
@@ -150,6 +150,11 @@ input[type="text"], input[type="password"] {
transition: border-color .15s, box-shadow .15s; transition: border-color .15s, box-shadow .15s;
} }
input:focus { border-color: var(--ocean); box-shadow: 0 0 0 3px rgba(27, 65, 97, 0.12); } input:focus { border-color: var(--ocean); box-shadow: 0 0 0 3px rgba(27, 65, 97, 0.12); }
/* Masked TEXT inputs (master, pass overlay): visually masked but type=text, so
the browser never treats them as password fields — no autofill / save / "suggest
strong password". Firefox uses the bundled disc font. */
input.mask { -webkit-text-security: disc; }
@supports not (-webkit-text-security: disc) { input.mask { font-family: "text-security-disc", var(--mono); } }
/* Buttons */ /* Buttons */
.btn { .btn {