Create passwordInput component
This commit is contained in:
@@ -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}>
|
||||
|
||||
Reference in New Issue
Block a user