Front-end 2FA

[brandonkelly]

Description

Exposes the system’s login form on the front end via /login (or whatever loginPath is set to), as a fallback if a custom login template at the same path doesn’t exist, complete with 2FA and passkey support.

Sites with custom login templates get 2FA support as well: when a user who requires 2FA submits a custom login form, the users/login action will now redirect them to /login?verify=1, which will render the 2FA verification form.

Additionally, system templates are now styled a bit more generically when rendered on the front end, and the styles can be overridden via a new systemTemplateCss config setting.

// config/general.php

return GeneralConfig::create()
    ->systemTemplateCss('/css/cp-theme.css')
;

/* web/css/cp-theme.css */

:root {
    --primary-button-bg: #2563eb;
    --primary-button-bg--hover: #1d4ed8;
    --primary-button-bg--active: #1e40af;
}

Tip

See src/web/assets/theme/dist/fe.css for a full list of properties that can be overridden.

To do

• Simplify the styling for system login & set-password templates when rendered on the front end
• Add support for theming system templates on the front end with CSS variables
• Support rendering the login & set-password templates on the “front end” (requests that aren’t explicitly for the control panel) when in headless mode.

Related issues

• [5.x]: Frontend Login Blocked when using TOTP #14844

[linear]

CMS-1350 Front end 2FA