Create passwordInput component

This commit is contained in:
T'JAMPENS QUENTIN p2406187
2025-12-07 14:58:42 +01:00
parent 86305699ed
commit efbf234fb9
3 changed files with 48 additions and 33 deletions
+1 -31
View File
@@ -9,7 +9,6 @@ import { AuthContext } from "../../contexts/auth/AuthContext.js";
function LoginForm({ className }) {
const [email, setEmail] = useState('');
const [password, setPassword] = useState('');
const [showPassword, setShowPassword] = useState(false);
let navigate = useNavigate();
const { login } = useContext(AuthContext);
@@ -19,10 +18,6 @@ function LoginForm({ className }) {
navigate("/");
}
const toggleShowPassword = () => {
setShowPassword(!showPassword);
};
return (
<div className={`${className} glassCard ${styles.inputContainer}`}>
<div className={styles.formgroup}>
@@ -35,32 +30,7 @@ function LoginForm({ className }) {
/>
</div>
<div className={styles.formgroup}>
<div style={{ position: 'relative', width: '100%' }}>
<Input
type={showPassword ? "text" : "password"}
value={password}
placeholder="Mot de passe"
onChange={e => setPassword(e.target.value)}
style={{ width: '100%' }}
/>
<button
type="button"
onClick={toggleShowPassword}
style={{
position: 'absolute',
width: '30px',
right: '10px',
top: '50%',
transform: 'translateY(-50%)',
background: 'none',
border: 'none',
cursor: 'pointer',
fontSize: '16px',
}}
>
{showPassword ? '👁️' : '🔒'}
</button>
</div>
<Input password={true} onChange={e => setPassword(e.target.value)} value={password} />
</div>
<div className={styles.logButton}>