rick/rosterchirp-dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v0.11.13 login screen fix

Browse Source
This commit is contained in:
Ricky Stretch
2026-03-21 19:23:20 -04:00
parent e2cff3180e
commit 69515c9e95
7 changed files with 68 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/pages/ChangePassword.jsx
View File

@@ -3,6 +3,7 @@ import { useNavigate } from 'react-router-dom';
import { useAuth } from '../contexts/AuthContext.jsx';
import { useToast } from '../contexts/ToastContext.jsx';
import { api } from '../utils/api.js';
import PasswordInput from '../components/PasswordInput.jsx';
export default function ChangePassword() {
const [current, setCurrent] = useState('');
@@ -40,15 +41,15 @@ export default function ChangePassword() {
<form onSubmit={submit} style={{ display: 'flex', flexDirection: 'column', gap: 16 }}>
<div className="flex-col gap-1">
<label className="text-sm font-medium" style={{ color: 'var(--text-secondary)' }}>Current Password</label>
<input className="input" type="password" value={current} onChange={e => setCurrent(e.target.value)} autoComplete="new-password" required />
<PasswordInput value={current} onChange={e => setCurrent(e.target.value)} autoComplete="new-password" required />
</div>
<div className="flex-col gap-1">
<label className="text-sm font-medium" style={{ color: 'var(--text-secondary)' }}>New Password</label>
<input className="input" type="password" value={next} onChange={e => setNext(e.target.value)} autoComplete="new-password" required />
<PasswordInput value={next} onChange={e => setNext(e.target.value)} autoComplete="new-password" required />
</div>
<div className="flex-col gap-1">
<label className="text-sm font-medium" style={{ color: 'var(--text-secondary)' }}>Confirm New Password</label>
<input className="input" type="password" value={confirm} onChange={e => setConfirm(e.target.value)} autoComplete="new-password" required />
<PasswordInput value={confirm} onChange={e => setConfirm(e.target.value)} autoComplete="new-password" required />
</div>
<button className="btn btn-primary" type="submit" disabled={loading}>
{loading ? 'Saving...' : 'Set New Password'}

3
frontend/src/pages/Login.css
View File

@@ -1,5 +1,6 @@
.login-page {
min-height: 100vh;
min-height: 100vh; /* fallback for browsers without dvh support */
min-height: 100dvh; /* dynamic viewport height — prevents bounce when mobile browser chrome resizes */
display: flex;
align-items: center;
justify-content: center;

3
frontend/src/pages/Login.jsx
View File

@@ -5,6 +5,7 @@ import { useToast } from '../contexts/ToastContext.jsx';
import { api } from '../utils/api.js';
import './Login.css';
import SupportModal from '../components/SupportModal.jsx';
import PasswordInput from '../components/PasswordInput.jsx';
export default function Login() {
const [email, setEmail] = useState('');
@@ -96,7 +97,7 @@ export default function Login() {
</div>
<div className="field">
<label>Password</label>
<input className="input" type="password" value={password} onChange={e => setPassword(e.target.value)} required placeholder="••••••••" />
<PasswordInput value={password} onChange={e => setPassword(e.target.value)} required placeholder="••••••••" />
</div>
<label className="remember-me">