fix(auth): tab from the user name straight into the password field
"Passwort vergessen?" came first in the markup; it now follows the field and keeps its place next to the label. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
0309b54a29
commit
e7d5db3e24
1 file changed
+19
-19
@@ -245,7 +245,7 @@ export const SetupAndAuthView: React.FC<SetupAndAuthViewProps> = ({
|
||||
// ============================================================================
|
||||
if (authStatus.needsSetup) {
|
||||
return (
|
||||
<div className="min-h-screen bg-canvas text-main flex flex-col items-center justify-center p-4 font-sans">
|
||||
<div className="min-h-[100dvh] bg-canvas text-main flex flex-col items-center justify-center p-4 font-sans">
|
||||
<div className="w-full max-w-xl panel-surface shadow-panel overflow-hidden">
|
||||
{/* Top Brand Bar */}
|
||||
<div className="p-4 bg-canvas border-b border-border flex items-center justify-between">
|
||||
@@ -472,7 +472,7 @@ export const SetupAndAuthView: React.FC<SetupAndAuthViewProps> = ({
|
||||
// STANDARD LOGIN / INVITE CODE / REGISTRATION VIEW
|
||||
// ============================================================================
|
||||
return (
|
||||
<div className="min-h-screen bg-canvas text-main flex flex-col items-center justify-center p-4 font-sans">
|
||||
<div className="min-h-[100dvh] bg-canvas text-main flex flex-col items-center justify-center p-4 font-sans">
|
||||
<div className="w-full max-w-md panel-surface shadow-panel overflow-hidden">
|
||||
{/* Top Header */}
|
||||
<div className="p-4 bg-canvas border-b border-border flex items-center justify-between">
|
||||
@@ -706,23 +706,8 @@ export const SetupAndAuthView: React.FC<SetupAndAuthViewProps> = ({
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div className="flex items-baseline justify-between mb-1">
|
||||
<label className="block text-muted">Passwort</label>
|
||||
{authStatus.passwordReset && (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
setAuthTab('forgot');
|
||||
setError(null);
|
||||
setNotice(null);
|
||||
}}
|
||||
className="text-accent hover:underline text-[11px] py-1"
|
||||
>
|
||||
Passwort vergessen?
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
<div className="relative">
|
||||
<label className="block text-muted mb-1">Passwort</label>
|
||||
<input
|
||||
type="password"
|
||||
value={password}
|
||||
@@ -731,6 +716,21 @@ export const SetupAndAuthView: React.FC<SetupAndAuthViewProps> = ({
|
||||
required
|
||||
className="w-full h-8 px-2.5 input-field"
|
||||
/>
|
||||
{/* After the field in the markup, so Tab goes from the name straight to the password;
|
||||
shown next to the label */}
|
||||
{authStatus.passwordReset && (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
setAuthTab('forgot');
|
||||
setError(null);
|
||||
setNotice(null);
|
||||
}}
|
||||
className="absolute right-0 -top-1 text-accent hover:underline text-[11px] py-1"
|
||||
>
|
||||
Passwort vergessen?
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="pt-1">
|
||||
|
||||
Reference in new issue
Block a user