fs
e775ed2800
Reworks the auth flow from a single centered card into a two-pane
layout — form on the left, tenant brand on the right — and tightens the
multi-step login UX along the way. Major changes:
LAYOUT
- templates/login.phtml splits into a flex-column body so the footer
spans both panes at the bottom instead of getting clipped under main.
- New .login-form-pane and .login-brand-pane on a 1fr/1fr grid above
768px; mobile stacks brand on top as a slim band, form below.
- Brand pane carries a soft halo + dot grid + tinted base, all derived
from --app-primary so it tracks the tenant accent automatically.
- Login card gets a Stripe-style hairline border + soft shadow, no
Pico article > header sectioning band, h1 in semibold + tracking-tight.
- The "body > main" global padding is overridden for login so the brand
panel reaches the very top + bottom edges of its column.
OS THEME FALLBACK
- New appExplicitTheme() returns the user/tenant theme or empty string,
used by login.phtml + error.phtml to OMIT data-theme entirely when no
preference exists. CSS prefers-color-scheme media query then drives
the theme — DB stays the source of truth, no browser-side persistence.
MULTI-STEP UX
- Heading is stage-aware: "Login" / "Select tenant" / "Login to {tenant}".
Drops the redundant "Login credentials" subtitle.
- Stage 3 gets an identity pill (icon + email + compact "use different
email" button) replacing the old tenant-context block, so the user
always sees which account they're signing in with regardless of
multi-tenant status.
- Stage 2 tenant selection drops avatars + initials — just radio + name
with text-overflow ellipsis for long tenant names.
- Tightens primary CTA: full-width on every stage incl. <p>-wrapped
buttons. autofocus moves to the right input per stage (ldap_username
/ password).
NOTICE / HELP LINKS
- The placeholder "Problems logging in" link is gone (it used to point
at the imprint route — misleading). show_support wired through 6
auth pages and the partial removed; architecture tests adjusted.
- Help-links centered with bullet separators between items, hairline
border-top so they read as secondary navigation under the main CTA.
- The "Encrypted / HTTPS/TLS 1.2+" trust badge at the card bottom is
removed — modern users assume HTTPS, and the badge added noise.
DEAD CODE
- $authLogoHref, $selectedTenantAvatarUrl, $selectedTenantInitial,
$hasSelectedTenantAvatar, $canSwitchTenant — unused after the
identity-pill / brand-pane move, removed from all 6 auth pages.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
81 lines
3.8 KiB
PHTML
81 lines
3.8 KiB
PHTML
<?php
|
|
|
|
/**
|
|
* @var mixed|null $error
|
|
* @var mixed|null $firstName
|
|
* @var mixed|null $lastName
|
|
* @var mixed|null $email
|
|
* @var mixed|null $password
|
|
* @var mixed|null $password2
|
|
*/
|
|
|
|
use MintyPHP\Buffer;
|
|
use MintyPHP\Session;
|
|
|
|
Buffer::set('title', t('Register'));
|
|
$passwordMinLength = (int) ($passwordMinLength ?? 0);
|
|
$passwordHints = is_array($passwordHints ?? null) ? $passwordHints : [];
|
|
$errorNoticeId = !empty($error) ? 'auth-register-error-notice' : '';
|
|
$passwordHintId = 'auth-register-password-hints';
|
|
$authHelpContext = [
|
|
'show_back_to_login' => true,
|
|
];
|
|
?>
|
|
<article class="login-card">
|
|
<header>
|
|
<hgroup>
|
|
<h1><?php e(t('Register')); ?></h1>
|
|
<p><?php e(t('Create your account')); ?></p>
|
|
</hgroup>
|
|
</header>
|
|
<form method="post">
|
|
<label for="first_name">
|
|
<span><?php e(t('First name')); ?></span>
|
|
<input required type="text" name="first_name" id="first_name" <?php if ($errorNoticeId !== ''): ?>aria-invalid="true" aria-describedby="<?php e($errorNoticeId); ?>"<?php endif; ?> />
|
|
</label>
|
|
<label for="last_name">
|
|
<span><?php e(t('Last name')); ?></span>
|
|
<input required type="text" name="last_name" id="last_name" <?php if ($errorNoticeId !== ''): ?>aria-invalid="true" aria-describedby="<?php e($errorNoticeId); ?>"<?php endif; ?> />
|
|
</label>
|
|
<label for="email">
|
|
<span><?php e(t('Email')); ?></span>
|
|
<input required type="email" name="email" id="email" autocomplete="email" <?php if ($errorNoticeId !== ''): ?>aria-invalid="true" aria-describedby="<?php e($errorNoticeId); ?>"<?php endif; ?> />
|
|
</label>
|
|
<fieldset>
|
|
<legend>
|
|
<small>
|
|
<?php e(t('Password')); ?>
|
|
</small>
|
|
</legend>
|
|
<label for="password">
|
|
<span><?php e(t('Password')); ?></span>
|
|
<input required type="password" name="password" id="password"
|
|
minlength="<?php e($passwordMinLength); ?>" autocomplete="new-password"
|
|
aria-describedby="<?php e(trim($passwordHintId . ' ' . $errorNoticeId)); ?>" <?php if ($errorNoticeId !== ''): ?>aria-invalid="true"<?php endif; ?> />
|
|
</label>
|
|
<label for="password2">
|
|
<span><?php e(t('Password (again)')); ?></span>
|
|
<input required type="password" name="password2" id="password2"
|
|
minlength="<?php e($passwordMinLength); ?>" autocomplete="new-password"
|
|
aria-describedby="<?php e(trim($passwordHintId . ' ' . $errorNoticeId)); ?>" <?php if ($errorNoticeId !== ''): ?>aria-invalid="true"<?php endif; ?> />
|
|
</label>
|
|
<div id="<?php e($passwordHintId); ?>" class="form-hint" data-password-hints data-password-input="#password" data-confirm-input="#password2"
|
|
data-email-input="#email" data-min-length="<?php e($passwordMinLength); ?>">
|
|
<strong><?php e(t('Password requirements')); ?></strong>
|
|
<ul class="form-hint-list">
|
|
<?php foreach ($passwordHints as $hint): ?>
|
|
<li data-rule="<?php e($hint['rule']); ?>"><?php e($hint['text']); ?></li>
|
|
<?php endforeach; ?>
|
|
<li data-rule="match"><?php e(t('Passwords must match')); ?></li>
|
|
</ul>
|
|
</div>
|
|
</fieldset>
|
|
<button type="submit"><?php e(t('Register')); ?></button>
|
|
<?php if (!empty($error)): ?>
|
|
<div id="<?php e($errorNoticeId); ?>" class="notice" data-variant="error" role="alert" aria-live="assertive" tabindex="-1"><?php e($error); ?></div>
|
|
<?php endif; ?>
|
|
<?php Session::getCsrfInput(); ?>
|
|
</form>
|
|
<?php require templatePath('partials/auth-help-links.phtml'); ?>
|
|
</article>
|