forked from Transparency/kgroad-frontend2
added policy checkbox in sign-up form, fixed height bug in sign-up page
This commit is contained in:
parent
74b15060a1
commit
7bc3e2ccb5
@ -90,7 +90,6 @@
|
|||||||
@media screen and (max-width: 550px) {
|
@media screen and (max-width: 550px) {
|
||||||
.auth-page {
|
.auth-page {
|
||||||
padding: 48px 16px;
|
padding: 48px 16px;
|
||||||
min-height: 600px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.auth-wrapper {
|
.auth-wrapper {
|
||||||
|
@ -6,6 +6,42 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
||||||
|
&__policy {
|
||||||
|
margin-top: 30px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 12px;
|
||||||
|
|
||||||
|
p,
|
||||||
|
a {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 500;
|
||||||
|
line-height: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
color: #344054;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #0077b6;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&__checkbox {
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border: 1px solid #d0d5dd;
|
||||||
|
border-radius: 4px;
|
||||||
|
img {
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
&__error {
|
&__error {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
|
@ -7,9 +7,12 @@ import Loader from "@/shared/ui/components/Loader/Loader";
|
|||||||
import GoogleButton from "@/features/GoogleButton/GoogleButton";
|
import GoogleButton from "@/features/GoogleButton/GoogleButton";
|
||||||
import { apiInstance } from "@/shared/config/apiConfig";
|
import { apiInstance } from "@/shared/config/apiConfig";
|
||||||
import { AxiosError } from "axios";
|
import { AxiosError } from "axios";
|
||||||
import { useRouter } from "@/shared/config/navigation";
|
import { Link, useRouter } from "@/shared/config/navigation";
|
||||||
|
import check from "./icons/check.svg";
|
||||||
|
import Image from "next/image";
|
||||||
|
|
||||||
const SignUpForm = () => {
|
const SignUpForm = () => {
|
||||||
|
const [checkbox, setCheckbox] = useState<boolean>(false);
|
||||||
const [emailWarning, setEmailWarning] = useState<string>("");
|
const [emailWarning, setEmailWarning] = useState<string>("");
|
||||||
const [passwordWarning, setPasswordWarning] = useState<string>("");
|
const [passwordWarning, setPasswordWarning] = useState<string>("");
|
||||||
const [passwordConfirmWarning, setPasswordConfirmWarning] =
|
const [passwordConfirmWarning, setPasswordConfirmWarning] =
|
||||||
@ -81,6 +84,14 @@ const SignUpForm = () => {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (!checkbox) {
|
||||||
|
setEmailWarning("");
|
||||||
|
setPasswordWarning("");
|
||||||
|
setPasswordConfirmWarning("");
|
||||||
|
setError("Необходимо принять политику конфиденциальности");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
setError("");
|
setError("");
|
||||||
setEmailWarning("");
|
setEmailWarning("");
|
||||||
@ -141,6 +152,19 @@ const SignUpForm = () => {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
{error ? <p className="sign-up-form__error">{error}</p> : null}
|
{error ? <p className="sign-up-form__error">{error}</p> : null}
|
||||||
|
<div className="sign-up-form__policy">
|
||||||
|
<button
|
||||||
|
onClick={() => setCheckbox((prev) => !prev)}
|
||||||
|
type="button"
|
||||||
|
className="sign-up-form__checkbox"
|
||||||
|
>
|
||||||
|
{checkbox ? <Image src={check} alt="Check Icon" /> : null}
|
||||||
|
</button>
|
||||||
|
<p>
|
||||||
|
Я ознакомлен(-а) с{" "}
|
||||||
|
<Link href="#">Политикой конфиденциальности</Link>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div className="sign-up-form__btns">
|
<div className="sign-up-form__btns">
|
||||||
<button className="sign-up-form__btns_first" type="submit">
|
<button className="sign-up-form__btns_first" type="submit">
|
||||||
|
7
src/widgets/forms/SignUpForm/icons/check.svg
Normal file
7
src/widgets/forms/SignUpForm/icons/check.svg
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
<svg width="15.007812" height="10.834961" viewBox="0 0 15.0078 10.835" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||||
|
<desc>
|
||||||
|
Created with Pixso.
|
||||||
|
</desc>
|
||||||
|
<defs/>
|
||||||
|
<path id="Icon" d="M14.1699 0.835938L5.00391 10.0029L0.836914 5.83594" stroke="#3695D8" stroke-opacity="1.000000" stroke-width="1.666667" stroke-linejoin="round" stroke-linecap="round"/>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 406 B |
Loading…
Reference in New Issue
Block a user