# Account pages > Sign in, password reset, one-time login, change password, change email and the sign-in-to-continue state, each in one centred auth card. - Recipe: R7 - Page kind: utility - Serves: /user/login, /user/password, /user/reset/{uid}/{timestamp}/{hash}, /user/{uid}/password, /user/{uid}/email, 403 (anonymous) - Base page: /user/login - Components: auth-card (https://brand.honorsociety.org/components/auth-card/), form (https://brand.honorsociety.org/components/form/), form-note (https://brand.honorsociety.org/components/form-note/), confirmation-panel (https://brand.honorsociety.org/components/confirmation-panel/), button (https://brand.honorsociety.org/components/button/), callout (https://brand.honorsociety.org/components/callout/), heading (https://brand.honorsociety.org/components/heading/), band (https://brand.honorsociety.org/components/band/) - HTML page: https://brand.honorsociety.org/recipes/r7-account-pages/ ## Overview **Serves:** /user/login, /user/password, the one-time login page /user/reset/{uid}/{timestamp}/{hash}, /user/{uid}/password, /user/{uid}/email, and the access-denied page for a visitor. **Base page:** /user/login. **Page kind:** utility. [All recipes](/recipes/) **How to use this recipe:** it shows a proven page shape, not a fixed template. Start from the closest recipe, choose the components that fit the content, combine them as needed and leave out what does not fit. Only the component rules are fixed: grounds, one gold element per viewport, heading order, marks and the rules on each component page. **Layout, every screen:** one white band, one [Auth card](/components/auth-card/) in the centre (at most 560px), one quiet line under it where the screen needs one. The site header, menu and footer stay as they are. **Card order:** head (H1 at the h2 size, intro), an optional notice or form alert, the form ending in one full-width gold button, a hairline, the support note. **Components:** auth-card, form (fields, password field with the eye toggle, form alert), form-note (form link, divider, support note), confirmation-panel, button (`--block`), callout (`--info` for the signed-in notice), heading, band. **Rules:** - The card heading is the page `h1`. The template prints no page head and no second title on these routes. The card is the head band of these screens: it holds the one `h1`. - One gold element per card: the submit button. Every other route is a `.hs-form-link`, and the heading has no gold rule. - `Honor Society®` on the first visible reference of each screen, `Honor Society` after it. The header logo does not count. - Give every field its `autocomplete`: `username` on the sign-in email, `email` on every other email field, `current-password` on a password the member already has, `new-password` on a new one. Email fields take `type="email"`. - Keep the Drupal form whole: the field `name` attributes, the hidden `form_build_id`, `form_id` and `form_token`, and every element another module adds. The snippets show the hidden fields as placeholders. - No `target="_blank"`. The help center opens in the same tab. - This page loads no script, so the eye toggles stay hidden here, as they do without `password.js`. Try them on the [Auth card](/components/auth-card/) page. ## Sign in `/user/login`, for a visitor. Form `user_login`. ```html

Honor Society® login

Welcome back. Sign in to your account.

Need help signing in? Visit our Help Center or contact Honor Society support.

New to Honor Society? Join now

``` ## Sign in, failed The same page after a wrong email address or password. The form alert sits under the head and takes focus; the email field keeps its value and shows the error; the password field is empty. ```html

Honor Society® login

Welcome back. Sign in to your account.

Your email address or password is not correct

Check your email address and password, then sign in again.

Need help signing in? Visit our Help Center or contact Honor Society support.

New to Honor Society? Join now

``` ## Reset password request `/user/password`, for a visitor. Form `user_pass`. ```html

Reset your password

Enter the email address you use to sign in. We will email you a link to set a new password.

Need help signing in? Visit our Help Center or contact Honor Society® support.

Remembered your password? Sign in

``` ## Reset password, signed in `/user/password` for a member who is signed in. Same form; there is no email field, because the link goes to the account’s own address. ```html

Reset your password

We will email you a link to set a new password. Know your current password? Change your password instead.

Need help signing in? Visit our Help Center or contact Honor Society® support.

``` ## Reset email sent The state after a reset request. The [Confirmation panel](/components/confirmation-panel/) replaces the form. ```html

Check your email

We sent a link to set a new password to avery.example@example.com. The link works once and expires in 24 hours.

Did not get the email? Check your spam folder, or send the link again.

Back to sign in

``` ## One-time login The page the emailed link opens: `/user/reset/{uid}/{timestamp}/{hash}`. Form `user_pass_reset`. It names the member’s email address, never the username. ```html

Set a new password

This link signs you in to the account for avery.example@example.com. Then you choose a new password.

The link works once and expires on October 15, 2026 at 3:20 pm.

Need help signing in? Visit our Help Center or contact Honor Society® support.

``` ## Change password `/user/{uid}/password`, the member’s own account. Form `password_policy_password_tab`, altered by `hs_user_account_password_form_alter()`. The meter and the rules are the site’s `HsUser\PasswordRules`. ```html

Change password

Back to your profile

``` ## Change email `/user/{uid}/email`, the member’s own account. Form `hs_user_account_email_form`. Copy as on the site today. ```html

Change email

Your email address is avery.example@example.com. It is also how you sign in.

Your email address is not on your public profile.

Back to your profile

``` ## Sign in to continue The access-denied page for a visitor (403). One button to the sign-in page that keeps the destination, so the member returns to the page they asked for. ```html

Sign in to continue

This page is for Honor Society® members. After you sign in, you return to this page.

Need help signing in? Visit our Help Center or contact Honor Society support.

New to Honor Society? Join now

``` ## Notes **Copy on /user/login:** - The H1 reads “Honor Society® login”: it is the first visible reference on the page. - Every link opens in the same tab, as on the rest of the site. - The card heading is the one `h1`, and the template prints no title on these routes. - Two exceptions to house rules, by design: “Join now” (not a verb plus a noun) keeps the join route short and secondary, and the login page carries no `Start Free Membership`, because it does not promote free membership. **Copy on the other screens** is new, in the same voice. It names the result (“Check your email”), what a link does and its limits (works once, the expiry), and the address it went to. **Drupal form IDs:** - Sign in, `user/login`: `user_login` (core). Altered by `user_registration` (welcome-back `em` prefill) and `user_profile_enhancements` (old suffix). - Reset request, `user/password`: `user_pass` (core). Altered by `user_profile_enhancements` (old suffix). - One-time login, `user/reset/%/%/%`: `user_pass_reset` (core). - Change password, `user/%user/password`: `password_policy_password_tab` (contrib), restyled by `hs_user_account_password_form_alter()`. - Change email, `user/%user/email`: `hs_user_account_email_form` (`hs_user`). - Sign in to continue, any denied path: no form; the `hs_core` template `hs-core-403.tpl.php`, visitor branch. The sidebar `user_login_block` is a different form ID. Leave it out of this restyle. **What the Drupal build must preserve:** - Hidden fields and tokens: `form_build_id`, `form_id`, and `form_token` on every form a signed-in member submits. Render the form with `drupal_render_children()` so every child another module adds still prints (honeypot, CAPTCHA, SSO controls). - Field names: `name` and `pass` on `user_login`, `name` on `user_pass`, `current_pass`, `pass` and `mail` on the account forms. Change only `#title`, `#attributes` and the theme wrapper. - Email sign-in: `email_registration` resolves an email address in `name` to the account. Set `type="email"` through the `hs_user_form_input` theme (`#hs_input_type`), as the change email form does; Form API textfields print `type="text"`. - Flood control: `user_login_authenticate_validate()` and `flood_control` limit failed attempts. Keep the validators. Rewrite their message in this voice without numbers the page cannot check: “This account is locked after too many failed sign-ins. Try again later, or reset your password.” - SSO handoff: `user_registration_user_login()` pushes the account to the Laravel membership app, sets the login cookies and redirects (the Membership hub, or back to an internal `?destination`). Submit the form normally through `user_login_submit()`, so `hook_user_login()` runs. No AJAX sign-in. - Destination redirects: keep `?destination=` on the form action. The 403 button builds its link with `drupal_get_destination()`. External destinations are ignored by `drupal_goto()`. - Reset confirmation: core `user_pass_submit()` redirects to `/user/login` with a status message. To show “Check your email”, redirect to the reset page with a flag and keep the address in `$_SESSION`. Never put the address in the URL. - Account enumeration: core `user_pass_validate()` says when no account has the address. Keep it (support load) or replace it with one neutral message for every address. Product decision; the sent state above works for both. - Expiry: the one-time link expires after `user_password_reset_timeout` (core default 86400 seconds, 24 hours). Print the confirmation’s “24 hours” and the one-time page’s date and time from that variable. - Old suffix: remove the help line and the second “Forgot your password?” that the `user_login` and `user_pass` alters in `user_profile_enhancements` add; the card replaces them. - Messages: status and error messages for these routes print inside the card, under the head, as callouts. A form error uses the form alert. - Change password today has one new-password field with show and hide, and no confirm field (`hs_user_password`). This recipe adds “Confirm new password”: the change password screen keeps it, with the eye toggle on every password field. - Change email: a verification step is planned. The new address will need a link from an email before it replaces the old one. The page will then show the confirmation panel with the new address. The email itself is out of scope here. **SEO for /user/login:** - Title: `Honor Society Login | Member Sign In`. Set it for this route only, with no second automatic “| Honor Society” suffix. - Description: `Sign in to your Honor Society account to manage your membership. Reset your password or visit our Help Center for account support.` - Canonical: `https://www.honorsociety.org/user/login`, absolute and single. - Keep the current robots policy for `/user/login`. No FAQ schema, no review markup, no promotional bands. Every link and line of copy is server-rendered. The `/user/{uid}/*` pages are private. **The hs_mcp validator** does not apply: these are system routes and module forms, not editor pages. **Missing components:** none. Round 4 added the auth card, the form link, divider and support note, the confirmation panel and the full-width button, and made the eye toggle the one password toggle.