TPS
/
halkbank_shahsyotag_frontend
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

eye added to log in page

This commit is contained in:
VividTruthKeeper 2022-04-02 13:54:37 +05:00
parent b2e695a77e
commit 68b2d0b818
4 changed files with 60 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
package-lock.json generated
View File

@ -5,6 +5,7 @@
"requires": true,
"packages": {
"": {
"name": "react-halkbank",
"version": "0.1.0",
"dependencies": {
"@testing-library/jest-dom": "5.16.1",
@ -4155,8 +4156,6 @@
"version": "8.9.0",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.9.0.tgz",
"integrity": "sha512-qOKJyNj/h+OWx7s5DePL6Zu1KeM9jPZhwBqs+7DzP6bGOvqzVCSf0xueYmVuaC/oQ/VtS2zLMLHdQFbkka+XDQ==",
"optional": true,
"peer": true,
"dependencies": {
"fast-deep-equal": "^3.1.1",
"json-schema-traverse": "^1.0.0",
@ -4171,9 +4170,7 @@
"node_modules/ajv-formats/node_modules/json-schema-traverse": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
"integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
"optional": true,
"peer": true
"integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug=="
},
"node_modules/ajv-keywords": {
"version": "3.5.2",
@ -20324,13 +20321,14 @@
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/ajv-formats/-/ajv-formats-2.1.1.tgz",
"integrity": "sha512-Wx0Kx52hxE7C18hkMEggYlEifqWZtYaRgouJor+WMdPnQyEK13vgEWyVNup7SoeeoLMsr4kf5h6dOW11I15MUA==",
"requires": {},
"requires": {
"ajv": "^8.0.0"
},
"dependencies": {
"ajv": {
"version": "https://registry.npmjs.org/ajv/-/ajv-8.9.0.tgz",
"version": "8.9.0",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.9.0.tgz",
"integrity": "sha512-qOKJyNj/h+OWx7s5DePL6Zu1KeM9jPZhwBqs+7DzP6bGOvqzVCSf0xueYmVuaC/oQ/VtS2zLMLHdQFbkka+XDQ==",
"optional": true,
"peer": true,
"requires": {
"fast-deep-equal": "^3.1.1",
"json-schema-traverse": "^1.0.0",
@ -20341,9 +20339,7 @@
"json-schema-traverse": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
"integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
"optional": true,
"peer": true
"integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug=="
}
}
},

51
src/components/sign/SignForm.js
View File

@ -6,6 +6,7 @@ import ReCAPTCHA from "react-google-recaptcha";
// IMPORT IMAGES
import logout from "../../icons/logout.svg";
import up from "../../icons/clipboard.svg";
import eye from "../../icons/eye.svg";
// IMPORT COMPONENTS
import Loader from "../../components/global/Loader";
@ -16,13 +17,7 @@ import { ValidateEmail } from "../../validators/ValidateEmail";
// SITEKEY
import { sitekey } from "../../recaptcha";
const SignForm = ({
setRecoveryOpen,
setFormData,
error,
isLoading,
setIsLoading,
}) => {
const SignForm = ({ setFormData, error, isLoading, setIsLoading }) => {
const data = new FormData();
const [inputValid, setInputValid] = useState({
login: null,
@ -31,6 +26,7 @@ const SignForm = ({
captcha: false,
});
const [btnEnabled, setBtnEnabled] = useState(false);
const [password, setPassword] = useState(true);
useEffect(() => {
if (
@ -91,21 +87,31 @@ const SignForm = ({
}}
/>
</div>
<div className="input-block">
<label htmlFor="password">Введите пароль</label>
<input
autoComplete="true"
required
type="password"
id="password"
onChange={(e) => {
if (e.target.value.length >= 8) {
setInputValid({ ...inputValid, password: e.target.value });
} else {
setInputValid({ ...inputValid, password: null });
}
}}
/>
<div className="input-block-outer">
<div className="input-block">
<label htmlFor="password">Введите пароль</label>
<input
autoComplete="true"
required
type={password ? "password" : "text"}
id="password"
onChange={(e) => {
if (e.target.value.length >= 8) {
setInputValid({ ...inputValid, password: e.target.value });
} else {
setInputValid({ ...inputValid, password: null });
}
}}
/>
<div
className="p-input-img"
onClick={() => {
setPassword(!password);
}}
>
<img src={eye} alt="reveal/hide" />
</div>
</div>
{error ? <span>Неверные имя пользователя или пароль</span> : ""}
</div>
<div className="captcha-wrapper">
@ -116,7 +122,6 @@ const SignForm = ({
setInputValid({ ...inputValid, captcha: true });
}}
/>
{/* <h1>Captcha</h1> */}
</div>
{/* <div className="forget">
<h3

2
src/pages/SuccessPage.js
View File

@ -1,5 +1,5 @@
// IMPORT MODULES
import react, { useEffect } from "react";
import React, { useEffect } from "react";
import { useNavigate } from "react-router-dom";
// IMPORT COMPONENTS

23
src/styles/_recovery.scss
View File

@ -24,6 +24,24 @@
.input-block-outer {
max-width: 34rem;
width: 100%;
display: flex;
flex-direction: column;
gap: 3rem;
span {
color: red;
}
}
.sign-form {
.input-block-outer {
max-width: unset;
.input-block {
position: relative;
height: 8.8rem;
}
}
}
.rel-block {
@ -133,6 +151,11 @@
}
@media screen and (max-width: 600px) {
.sign-form {
.p-input-img {
left: calc(100% - 6rem);
}
}
.p-recovery-content {
display: grid;
grid-template-columns: 1fr;