Add remember me checkbox, center and narrow sign-in form

- Add "Remember me for 30 days" checkbox (30-day vs 24-hour session expiry)
- Center heading and constrain form width to max-w-md
- Preserve remember_me preference through TOTP and WebAuthn auth flows

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Dan Milne
2026-04-11 11:22:51 +10:00
parent 2235924f37
commit 9197524c88
4 changed files with 29 additions and 9 deletions

View File

@@ -1,6 +1,6 @@
<div class="mx-auto md:w-2/3 w-full" data-controller="webauthn login-form" data-webauthn-check-url-value="/webauthn/check">
<div class="mx-auto max-w-md w-full" data-controller="webauthn login-form" data-webauthn-check-url-value="/webauthn/check">
<div class="mb-8">
<h1 class="font-bold text-4xl">Sign in to Clinch</h1>
<h1 class="font-bold text-4xl text-center">Sign in to Clinch</h1>
</div>
<%= form_with url: signin_path, class: "contents", data: { controller: "form-errors" } do |form| %>
@@ -53,6 +53,11 @@
class: "block shadow-sm rounded-md border border-gray-400 focus:outline-blue-600 px-3 py-2 mt-2 w-full dark:border-gray-600 dark:bg-gray-800 dark:text-gray-100" %>
</div>
<div class="my-5 flex items-center">
<%= form.check_box :remember_me, { class: "rounded border-gray-400 text-blue-600 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-800" }, "1", "0" %>
<%= form.label :remember_me, "Remember me for 30 days", class: "ml-2 text-sm text-gray-600 dark:text-gray-400" %>
</div>
<div class="my-5">
<%= form.submit "Sign in",
class: "w-full rounded-md px-3.5 py-2.5 bg-blue-600 hover:bg-blue-500 text-white font-medium cursor-pointer" %>