diff --git a/frontend/packages/agent/src/agent.css b/frontend/packages/agent/src/agent.css index 4243acf7..abd1ba1c 100644 --- a/frontend/packages/agent/src/agent.css +++ b/frontend/packages/agent/src/agent.css @@ -413,7 +413,7 @@ a:hover { color: var(--fg); text-shadow: 0 0 12px rgba(137, 220, 235, 0.9); } flex: 1; } .sendform input:focus { outline: 1px solid var(--purple); } -.loginform { display: flex; gap: 0.6em; margin-top: 0.5em; align-items: stretch; } +.loginform { display: flex; gap: 0.6em; margin-top: 0.5em; } .loginform input { font-family: inherit; font-size: 1em; background: rgba(255, 255, 255, 0.04); @@ -423,36 +423,6 @@ a:hover { color: var(--fg); text-shadow: 0 0 12px rgba(137, 220, 235, 0.9); } flex: 1; } .loginform input:focus { outline: 1px solid var(--purple); } - -/* #568: show / hide toggle for the masked OAuth-code input. Quiet - by default (muted border + transparent bg), lights amber on - hover / when pressed (aria-pressed="true") so the operator - sees at a glance whether the code is currently visible. */ -.loginform-reveal { - font-family: inherit; - font-size: 1em; - background: transparent; - color: var(--muted); - border: 1px solid var(--purple-dim); - border-radius: 3px; - padding: 0 0.6em; - cursor: pointer; - display: inline-flex; - align-items: center; - justify-content: center; - transition: color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease; -} -.loginform-reveal:hover, -.loginform-reveal:focus-visible { - color: var(--amber); - border-color: var(--amber); - outline: none; -} -.loginform-reveal[aria-pressed="true"] { - color: var(--amber); - border-color: var(--amber); - box-shadow: 0 0 8px -2px var(--amber); -} pre.diff { background: rgba(255, 255, 255, 0.03); border: 1px solid var(--purple-dim); diff --git a/frontend/packages/agent/src/app.js b/frontend/packages/agent/src/app.js index 7889083f..87b12306 100644 --- a/frontend/packages/agent/src/app.js +++ b/frontend/packages/agent/src/app.js @@ -351,38 +351,11 @@ window.marked = marked; const code = el('form', { action: '/login/code', method: 'POST', class: 'loginform', 'data-async': '', }); - // #568: OAuth code is a sensitive secret — mask the input with - // type="password" so a shoulder-surfer / screenshot doesn't - // capture it. The reveal button flips it back to text on press - // so the operator can sanity-check the paste before submit. - const codeInput = el('input', { - name: 'code', - type: 'password', - placeholder: 'paste OAuth code here (hidden)', - required: '', - // `one-time-code` is the semantic value for OAuth codes (per - // WHATWG / argus #592 review): browsers may silently ignore - // `autocomplete="off"` on `type="password"` inputs, but - // `one-time-code` is honoured + suppresses the "save password - // for this site?" prompt that would otherwise fire on submit. - autocomplete: 'one-time-code', - spellcheck: 'false', - }); - const reveal = el('button', { - type: 'button', - class: 'loginform-reveal', - title: 'show / hide pasted code', - 'aria-label': 'show / hide pasted OAuth code', - 'aria-pressed': 'false', - }, '👁'); - reveal.addEventListener('click', () => { - const showing = codeInput.getAttribute('type') === 'text'; - codeInput.setAttribute('type', showing ? 'password' : 'text'); - reveal.setAttribute('aria-pressed', showing ? 'false' : 'true'); - }); code.append( - codeInput, - reveal, + el('input', { + name: 'code', placeholder: 'paste OAuth code here', + required: '', autocomplete: 'off', + }), el('button', { type: 'submit', class: 'btn btn-login' }, '◆ S3ND C0DE'), ); root.append(code);