diff --git a/src/components/CandidateSidebar/candidateSidebar.scss b/src/components/CandidateSidebar/candidateSidebar.scss
index df692839..e13ffa72 100644
--- a/src/components/CandidateSidebar/candidateSidebar.scss
+++ b/src/components/CandidateSidebar/candidateSidebar.scss
@@ -12,7 +12,7 @@
margin-bottom: 1rem;
h2 {
- font-size: 3rem;
+ font-size: 2.5rem;
font-family: 'GT Eesti Pro Display', sans-serif;
font-weight: 700;
font-style: normal;
@@ -26,7 +26,6 @@
flex-wrap: wrap;
justify-content: flex-start;
padding: 0 1rem;
- margin-bottom: 80px;
}
&__info {
@@ -48,8 +47,8 @@
}
.candidate-sidebar__info > img {
- width: 180px;
- height: 180px;
+ width: 150px;
+ height: 150px;
border-radius: 100px;
}
@@ -65,7 +64,7 @@
.candidate-sidebar__experience {
font-family: 'GT Eesti Pro Display', sans-serif;
- font-size: 3em;
+ font-size: 2.5em;
font-weight: 700;
font-style: normal;
letter-spacing: normal;
diff --git a/src/images/close.png b/src/images/close.png
new file mode 100644
index 00000000..e0d507ad
Binary files /dev/null and b/src/images/close.png differ
diff --git a/src/pages/PartnerAddRequest/PartnerAddRequest.js b/src/pages/PartnerAddRequest/PartnerAddRequest.js
index 478df586..c4728bbb 100644
--- a/src/pages/PartnerAddRequest/PartnerAddRequest.js
+++ b/src/pages/PartnerAddRequest/PartnerAddRequest.js
@@ -1,15 +1,16 @@
-import React from 'react';
+import React, { useState } from 'react';
import {ProfileHeader} from "../../components/ProfileHeader/ProfileHeader";
import {ProfileBreadcrumbs} from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs"
import {Footer} from "../../components/Footer/Footer";
+import {Navigate} from "react-router-dom";
import arrowDown from "../../images/selectArrow.png"
import processImg from "../../images/partnerAddRequestFirstImg.png"
import reportImg from "../../images/partnerAddRequestSecondImg.png"
import documentsImg from "../../images/partnerAddRequestThirdInfo.png"
+import deleteIcon from "../../images/close.png"
-import {Navigate} from "react-router-dom";
import './partnerAddRequest.scss'
@@ -17,6 +18,13 @@ export const PartnerAddRequest = () => {
if(localStorage.getItem('role_status') !== '18') {
return
}
+
+ const [skills, setSkills] = useState(['REST API', 'Async/await'])
+ const [selectedSkills, setSelectedSkills] = useState([])
+ const [filteredSkills, setFilteredSkills] = useState(skills)
+
+ const [openSkillsSelect, setOpenSkillsSelect] = useState(false)
+
return (
@@ -51,6 +59,50 @@ export const PartnerAddRequest = () => {
+
+
Навыки
+
{setOpenSkillsSelect(true)}}>
+ {Boolean(selectedSkills.length) &&
+ selectedSkills.map((skill, index) => {
+ return
+
{skill}
+
{
+ setFilteredSkills(prevArray => [...prevArray, skill])
+ setSelectedSkills(selectedSkills.filter((skill, indexSkill) => {
+ return indexSkill !== index
+ }))
+ }} />
+
+ })
+ }
+ {!selectedSkills.length &&
+
{
+ setFilteredSkills(skills.filter((skill) => {
+ return skill.toLowerCase().includes(e.target.value.toLowerCase())
+ }))
+ }} />
+ }
+
+ {openSkillsSelect && Boolean(filteredSkills.length) &&
+
+ {filteredSkills.map((skill, index) => {
+ return {
+ setSelectedSkills(prevArray => [...prevArray, skill])
+ setFilteredSkills(filteredSkills.filter((skill, skillIndex) => {
+ return skillIndex !== index
+ }))
+ setOpenSkillsSelect(false)
+ }}
+ >
+ {skill}
+ })}
+
+ }
+
Квалификация
diff --git a/src/pages/PartnerAddRequest/partnerAddRequest.scss b/src/pages/PartnerAddRequest/partnerAddRequest.scss
index c27c168c..af465e86 100644
--- a/src/pages/PartnerAddRequest/partnerAddRequest.scss
+++ b/src/pages/PartnerAddRequest/partnerAddRequest.scss
@@ -47,6 +47,7 @@
padding: 25px 95px 30px 55px;
min-width: 600px;
width: 100%;
+ position: relative;
@media (max-width: 750px) {
padding: 15px 50px 15px 30px;
@@ -62,7 +63,8 @@
}
&__section {
- margin-bottom: 35px;
+ margin-bottom: 22px;
+ position: relative;
&:last-child {
margin-bottom: 0;
@@ -182,6 +184,73 @@
line-height: 32px;
border: none;
}
+
+ &__skills {
+ display: flex;
+ gap: 5px;
+ flex-wrap: wrap;
+ background: #EFF2F7;
+ border-radius: 8px;
+ padding: 8px 12px 9px;
+ position: relative;
+ cursor: pointer;
+
+ .skill {
+ background: #8DC63F;
+ border-radius: 12px;
+ font-weight: 400;
+ font-size: 12px;
+ line-height: 14px;
+ color: #263238;
+ padding: 6px 6px 5px;
+ max-width: 100px;
+ width: 100%;
+ display: flex;
+ justify-content: space-evenly;
+ align-items: center;
+
+ img {
+ width: 13px;
+ }
+ }
+
+ input {
+ border: none;
+ outline: none;
+ width: 100%;
+ background: none;
+ font-weight: 400;
+ font-size: 15px;
+ line-height: 18px;
+ height: 25px;
+ color: #263238;
+ }
+ }
+
+ &__dropDown {
+ position: absolute;
+ display: flex;
+ flex-direction: column;
+ background: #EFF2F7;
+ border-radius: 8px;
+ padding: 5px 20px;
+ row-gap: 10px;
+ z-index: 100;
+
+ span {
+ cursor: pointer;
+ font-weight: 400;
+ font-size: 12px;
+ line-height: 14px;
+ color: #263238;
+ background: #8DC63F;
+ border-radius: 12px;
+ padding: 5px;
+ max-width: 100px;
+ width: 100%;
+ text-align: center;
+ }
+ }
}
footer {