arnef/nidus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Releases 3 Activity

Add password-visibility toggle to login page (TypeScript)

Browse Source 
- web/ts/login.ts: small vanilla TS module toggling the password input's
  type between 'password'/'text' via a 'Show/Hide' button, so users can
  rule out typos before submitting. Compiled to web/static/login.js
  (ES module) via tsc (web/tsconfig.json, new 'make web-ts'/'web-assets'
  Makefile targets) and loaded via <script type="module">. Compiled JS
  is committed/embedded the same way as the compiled CSS — no Node.js
  needed at runtime.
- Verified end-to-end against the live proxied server
  (https://local.unqr.dev/web/login): POST /web/login correctly returns
  303 + Set-Cookie, and the session then authorizes GET /web/ — the
  server-side login flow is confirmed working correctly.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
arnef
2026-08-19 10:13:37 +02:00
co-authored by Copilot
parent 4dba55c807
commit 3dc49b6b22
11 changed files with 469 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
internal/web/templates/login_templ.go
+1 -1
View File
@@ -52,7 +52,7 @@ func Login(errorMsg string) templ.Component {
return templ_7745c5c3_Err
}
}
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "<form method=\"POST\" action=\"/web/login\" class=\"space-y-4\"><div><label for=\"username\" class=\"block text-sm font-medium text-gray-700\">Username</label> <input id=\"username\" name=\"username\" type=\"text\" required autofocus class=\"mt-1 block w-full rounded-md border-gray-300 border px-3 py-2 shadow-sm focus:border-indigo-500 focus:ring-indigo-500\"></div><div><label for=\"password\" class=\"block text-sm font-medium text-gray-700\">Password</label> <input id=\"password\" name=\"password\" type=\"password\" required class=\"mt-1 block w-full rounded-md border-gray-300 border px-3 py-2 shadow-sm focus:border-indigo-500 focus:ring-indigo-500\"></div><button type=\"submit\" class=\"w-full bg-indigo-600 text-white rounded-md py-2 font-medium hover:bg-indigo-700\">Sign in</button></form></div></body></html>")
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "<form method=\"POST\" action=\"/web/login\" class=\"space-y-4\"><div><label for=\"username\" class=\"block text-sm font-medium text-gray-700\">Username</label> <input id=\"username\" name=\"username\" type=\"text\" required autofocus class=\"mt-1 block w-full rounded-md border-gray-300 border px-3 py-2 shadow-sm focus:border-indigo-500 focus:ring-indigo-500\"></div><div><label for=\"password\" class=\"block text-sm font-medium text-gray-700\">Password</label><div class=\"mt-1 flex gap-2\"><input id=\"password\" name=\"password\" type=\"password\" required class=\"block w-full rounded-md border-gray-300 border px-3 py-2 shadow-sm focus:border-indigo-500 focus:ring-indigo-500\"> <button type=\"button\" id=\"toggle-password\" aria-pressed=\"false\" class=\"shrink-0 rounded-md border border-gray-300 px-3 py-2 text-sm text-gray-600 hover:bg-gray-50\">Show</button></div></div><button type=\"submit\" class=\"w-full bg-indigo-600 text-white rounded-md py-2 font-medium hover:bg-indigo-700\">Sign in</button></form></div><script type=\"module\" src=\"/web/static/login.js\"></script></body></html>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}