Merge pull request #66 from apuc/candidate-area

Candidate area

src/components/Candidate/Candidate.js

@@ -4,6 +4,8 @@ import {useSelector, useDispatch} from 'react-redux'
 
 import SkillSection from '../SkillSection/SkillSection'
 import Sidebar from '../CandidateSidebar/CandidateSidebar'
+import {ProfileHeader} from "../ProfileHeader/ProfileHeader";
+import {ProfileBreadcrumbs} from "../ProfileBreadcrumbs/ProfileBreadcrumbs";
 import {Footer} from '../Footer/Footer'
 
 import {currentCandidate, selectCurrentCandidate,} from '../../redux/outstaffingSlice'
@@ -11,15 +13,16 @@ import {currentCandidate, selectCurrentCandidate,} from '../../redux/outstaffing
 import {apiRequest} from "../../api/request";
 import {createMarkup} from "../../helper";
 
-import arrow from '../../images/right-arrow.png'
+import gitImgItem from "../../images/gitItemImg.png"
 import rectangle from '../../images/rectangle_secondPage.png'
 import front from '../Outstaffing/images/front_end.png'
 import back from '../Outstaffing/images/back_end.png'
 import design from '../Outstaffing/images/design.png'
+import rightArrow from "../../images/arrowRight.png"
+
+import {LEVELS, SKILLS} from '../../constants/constants'
 
 import './candidate.scss'
-import {LogoutButton} from "../LogoutButton/LogoutButton";
-import {Header} from "../Header/Header";
 
 
 const Candidate = () => {
@@ -87,19 +90,28 @@ const Candidate = () => {
   const {header, img, classes} = setStyles();
 
   return (
-      <>
+      <div className='candidate__wrapper'>
-        <Header/>
+        <ProfileHeader/>
         <div className='container candidate'>
+          <ProfileBreadcrumbs links={[
+            {name: 'Главная', link: '/profile'},
+            {name: 'Каталог свободных специалистов', link: '/profile/catalog'},
+            {name: `${currentCandidateObj.specification} ${SKILLS[currentCandidateObj.position_id]}, ${LEVELS[currentCandidateObj.level]}`, link: `/candidate/${currentCandidateObj.id}`}
+          ]}
+          />
 
           <div className='row'>
             <div className='col-12 candidate__header'>
 
-              <div className='candidate__arrow' onClick={() => navigate('/')}>
+              <div className='candidate__header__left'>
-                <div className='candidate__arrow-img'>
+                <h3>{currentCandidateObj.specification}{SKILLS[currentCandidateObj.position_id]} {LEVELS[currentCandidateObj.level]}</h3>
-                  <img src={arrow} alt=''/>
+                <div className='candidate__arrow' onClick={() => navigate('/profile/catalog')}>
-                </div>
+                  <div className='candidate__arrow-img'>
-                <div className='candidate__arrow-sp'>
+                    <img src={rightArrow} alt=''/>
-                  <span>Вернуться к списку</span>
+                  </div>
+                  <div className='candidate__arrow-sp'>
+                    <span>Вернуться к списку</span>
+                  </div>
                 </div>
               </div>
 
@@ -145,35 +157,59 @@ const Candidate = () => {
                         <div className="col-12 col-xl-8">
                           <div className="candidate__works works">
                             <div className="works__body">
-                              <div className="works__item item-works">
+                              <div className="works__body__info">
-                                <div className="item-works__body">
+                                <p>Страница портфолио кода разработчика</p>
-                                  <Link to="/" className="item-works__link">Vuetifyis.com</Link>
-                                  <div className="item-works__text">Forked from
-                                    peluprvi/vuetifyjs.com <br/> Vuetifyjs.com
-                                    documentation
-                                  </div>
-                                  <div className="item-works__mark">Angular</div>
-                                </div>
                               </div>
                               <div className="works__item item-works">
-                                <div className="item-works__body">
+                                <Link className="item-works__body">
-                                  <Link to="/" className="item-works__link">Vuetifyis.com</Link>
+                                  <div className='item-works__body__head'>
-                                  <div className="item-works__text">Forked from
+                                    <div className='item-works__body__info'>
-                                    peluprvi/vuetifyjs.com <br/> Vuetifyjs.com
+                                      <img src={gitImgItem} alt='img' />
-                                    documentation
+                                      <div className='item-works__body__project'>
+                                        <h5>cybershop-api</h5>
+                                        <p>Реактивная социальная сеть</p>
+                                      </div>
+                                    </div>
+                                    <div className='item-works__body__head__arrow'>
+                                      <img src={rightArrow} alt='arrow' />
+                                    </div>
                                   </div>
-                                  <div className="item-works__mark">Angular</div>
+                                  <span>JavaScript </span>
-                                </div>
+                                </Link>
                               </div>
                               <div className="works__item item-works">
-                                <div className="item-works__body">
+                                <Link className="item-works__body">
-                                  <Link to="/" className="item-works__link">Vuetifyis.com</Link>
+                                  <div className='item-works__body__head'>
-                                  <div className="item-works__text">Forked from
+                                    <div className='item-works__body__info'>
-                                    peluprvi/vuetifyjs.com <br/> Vuetifyjs.com
+                                      <img src={gitImgItem} alt='img' />
-                                    documentation
+                                      <div className='item-works__body__project'>
+                                        <h5>cybershop-api</h5>
+                                        <p>Реактивная социальная сеть</p>
+                                      </div>
+                                    </div>
+                                    <div className='item-works__body__head__arrow'>
+                                      <img src={rightArrow} alt='arrow' />
+                                    </div>
                                   </div>
-                                  <div className="item-works__mark item-works__mark_yellow">Laravel</div>
+                                  <span>JavaScript </span>
-                                </div>
+                                </Link>
+                              </div>
+                              <div className="works__item item-works">
+                                <Link className="item-works__body">
+                                  <div className='item-works__body__head'>
+                                    <div className='item-works__body__info'>
+                                      <img src={gitImgItem} alt='img' />
+                                      <div className='item-works__body__project'>
+                                        <h5>cybershop-api</h5>
+                                        <p>Реактивная социальная сеть</p>
+                                      </div>
+                                    </div>
+                                    <div className='item-works__body__head__arrow'>
+                                      <img src={rightArrow} alt='arrow' />
+                                    </div>
+                                  </div>
+                                  <span>JavaScript </span>
+                                </Link>
                               </div>
                             </div>
                           </div>
@@ -185,7 +221,7 @@ const Candidate = () => {
           </div>
           <Footer/>
         </div>
-      </>
+      </div>
   )
 };
 

src/components/Candidate/candidate.scss

@@ -1,12 +1,22 @@
-@use 'sass:math'; 
+@use 'sass:math';
 .candidate {
+  padding-top: 23px;
+
+  &__wrapper {
+    background: #F1F1F1;
+    min-height: 100vh;
+  }
 
 
   &__header {
     display: flex;
-    align-items: center;
     justify-content: space-between;
-    margin-top: 120px;
+
+    &__left {
+      h3 {
+        margin-bottom: 30px;
+      }
+    }
   }
 
   &__main {
@@ -86,14 +96,26 @@
 
   &__arrow {
     display: flex;
-    justify-content: space-between;
     align-items: center;
     cursor: pointer;
     &-img {
-      margin-right: 10px;
+      width: 48px;
+      height: 48px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      background: #D3E4BC;
+      border-radius: 50px;
+      margin-right: 20px;
+
+      img {
+        transform: rotate(180deg);
+      }
     }
     &-sp {
-      font-size: 14px;
+      font-size: 12px;
+      color: #5B6871;
+      max-width: 75px;
     }
   }
 
@@ -279,7 +301,7 @@
 }
 
 
-.candidate__works{ 
+.candidate__works{
   @media (min-width: 576px) {
     padding: 0 0 45px 0;
   }
@@ -288,13 +310,26 @@
   display: flex;
   flex-wrap: wrap;
   margin: 0 -15px -30px;
+  column-gap: 10px;
+  row-gap: 15px;
+
+  &__info {
+    width: 100%;
+    background: #E1FCCF;
+    border-radius: 12px 12px 0px 0px;
+    padding: 20px 0 20px 50px;
+
+    p {
+      font-weight: 400;
+      font-size: 18px;
+      line-height: 32px;
+    }
+  }
 }
 .item-works{
   display: flex;
   flex-direction: column;
-  padding: 0 15px;
+  flex: 0 1 49%;
-  margin: 0 0 30px 0;
-  flex: 0 1 50%;
   position: relative;
 
   @media (max-width: 761px) {
@@ -302,60 +337,79 @@
   }
 
   &__body{
-    padding: 17px;
-    border: 2px solid #54b611;
-    border-radius: 10px;
-
-    &::before{
-      content: "";
-      position: absolute;
-      top: -2px;
-      left: 25px;
-      height: 5px;
-      width: 29px;
-      border-radius: 3px;
-      background-color: #54b611;
-    }
-  }
-
-  &__link{
-    color: #0350dc;
-    font-family: "GT Eesti Pro Display", sans-serif;
-    font-size: 16px;
-    font-weight: 400;
-    letter-spacing: normal;
-    line-height: math.div(36,16);
-    text-decoration: underline;
-    display: block;
-    margin-bottom: 17px;
-  }
-  &__text{
-    margin-bottom: 37px;
-    color: #000000;
-    font-family: "GT Eesti Pro Display - Thin", sans-serif;
-    font-size: 12px;
-    font-weight: 400;
-    line-height: math.div(18,12);
-  }
-  &__mark{
-    font-size: 13px;
     display: flex;
-    align-items: center;
+    flex-direction: column;
-    column-gap: 7px;
+    background: #FFFFFF;
-    line-height: math.div(36,13);
+    height: 170px;
+    padding: 25px 40px 25px 25px;
+    border-radius: 12px;
+    justify-content: space-between;
 
-    &::before{
+    &:hover {
-      border-radius: 50%;
+      text-decoration: none;
-      content: "";
+    }
-      width: 13px;
+
-      height: 13px;
+    &__head {
-      background-color: #73c141;
+      display: flex;
+      justify-content: space-between;
+
+      &__arrow {
+        width: 48px;
+        height: 48px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        border-radius: 50px;
+        background: #DDEEC6;
+        margin: auto 0;
+      }
+    }
+
+    &__info {
+      display: flex;
+      position: relative;
+      align-items: start;
+      img {
+        margin-top: 15px;
+      }
+
+      &:after {
+        content: "";
+        position: absolute;
+        width: 100%;
+        height: 8px;
+        border-radius: 12px;
+        background: #D4F123;
+        bottom: -36%;
+        left: 10%;
+      }
+
+    }
+
+    &__project {
+      margin-left: 15px;
+      h5 {
+        font-weight: 700;
+        font-size: 18px;
+        line-height: 32px;
+        color: #000000;
+      }
+
+      p {
+        font-weight: 300;
+        font-size: 16px;
+        line-height: 22px;
+        max-width: 120px;
+        color: #000000;
+      }
+    }
+
+    span {
+      font-weight: 400;
+      font-size: 14px;
+      line-height: 32px;
+      color: #000000;
+      text-align: end;
     }
-    &_yellow{
-      &::before{    
-      background-color: #e09f14;
-    }      
-  } 
-    
   }
-}
+}

src/components/CandidateSidebar/candidateSidebar.scss

@@ -2,9 +2,10 @@
   display: flex;
   flex-direction: column;
   align-items: center;
-  border: 2px solid whitesmoke;
+  border-radius: 12px;
   border-bottom: none !important;
   position: sticky;
+  background: #FFFFFF;
   top: 80px;
 
   &__position {

src/components/Footer/Footer.js

@@ -1,52 +1,49 @@
 import React from 'react'
 
-import align from '../../images/align-left.png'
+import logo from '../../images/logoGuild.png'
-import phone from '../../images/phone.png'
+import vk from '../../images/vkLogo.svg'
-import telegram from '../../images/telegram.png'
+import tg from '../../images/tgLogo.svg'
+import email from '../../images/emailLogo.svg'
 
 import './footer.scss'
 
 export const Footer = () => {
   return (
-    <div className='container'>
       <footer>
-        <div className='footer row'>
+        <div className='container'>
-          <div className='col-12 col-xl-7'>
+          <div className='footer'>
-            <div className='footer__left'>
+            <div className='footer__top'>
-              <div className='footer__img'>
+              <img src={logo} alt='logo' />
-                <img src={align} alt='' />
+              <p>Подберем и документально оформим IT-специалистов, после чего передадим исполнителей под ваше руководство.
+                Вы получаете полное управление над сотрудниками, имея возможность контролировать и заменять IT штат.</p>
+              <div className='footer__copyright'>
+                © {new Date().getFullYear()} - Все права защищены
               </div>
-              <div className='footer__description'>
+            </div>
-                <span>
+            <div className='footer__bottom'>
-                  Подберем и документально оформим IT-специалистов, после чего
+              <div className='footer__social'>
-                  передадим исполнителей под ваше руководство. Вы получаете
+                <div className='footer__social__icons'>
-                  полное управление над сотрудниками, имея возможность
+                  <a>
-                  контролировать и заменять IT штат.{' '}
+                    <img src={vk} alt='vk' />
-                </span>
+                  </a>
+                  <a>
+                    <img src={tg} alt='tg' />
+                  </a>
+                </div>
+                <p>Войти в команду</p>
+              </div>
+              <div className='footer__info'>
+                <div className='footer__mail'>
+                  <a>
+                    <img src={email} alt='email' />
+                  </a>
+                  <p>office@itguild.info</p>
+                </div>
+                <a className='footer__policy'>Политика конфиденциальности</a>
               </div>
             </div>
           </div>
-
-          <div className='col-4 col-xl-2'>
-            <div className='footer__icon'>
-              <img src={phone} alt='' />
-              <img src={telegram} alt='' />
-            </div>
-          </div>
-
-          <div className='col-8 col-xl-3'>
-            <div className='footer__right'>
-              <a href='tel:+7 495 156-78-98' className='footer__phone'>
-                +7 495 156 78 98
-              </a>
-              <p className='footer__hours'>Будни с 9:00 до 21:00</p>
-            </div>
-          </div>
-        </div>
-        <div className='footer__copyright'>
-          {new Date().getFullYear()} © Outstaffing
         </div>
       </footer>
-    </div>
   )
 }

src/components/Footer/footer.scss

@@ -1,99 +1,215 @@
-.footer {
+footer {
-  margin-top: -3rem;
+  border-top: 1px solid #EBEBEB;
+  padding: 35px 0 50px;
+}
 
-  &__left {
+.footer {
+
+  &__top {
+    display: flex;
+    align-items: start;
+
+    @media (max-width: 620px) {
+      flex-direction: column;
+      align-items: center;
+      row-gap: 15px;
+    }
+
+    p {
+      max-width: 620px;
+      margin-left: 33px;
+      font-weight: 400;
+      font-size: 12px;
+      line-height: 16px;
+      color: #5B6871;
+
+      @media (max-width: 620px) {
+        margin-left: 0;
+        text-align: center;
+      }
+    }
+  }
+
+  &__bottom {
+    display: flex;
+    align-items: center;
+    margin-top: 22px;
+    justify-content: space-between;
+
+    @media (max-width: 590px) {
+      flex-direction: column;
+    }
+  }
+
+  &__social {
+    display: flex;
+    align-items: center;
+
+    @media (max-width: 590px) {
+      flex-direction: column;
+      justify-content: center;
+    }
+
+    &__icons {
+      display: flex;
+      column-gap: 10px;
+    }
+
+    p {
+      cursor: pointer;
+      margin-left: 60px;
+      font-weight: 500;
+      font-size: 14px;
+      line-height: 33px;
+
+      @media (max-width: 590px) {
+        margin-left: 0;
+      }
+    }
+  }
+
+  &__info {
     display: flex;
     align-items: center;
   }
 
-  &__description {
+  &__mail {
-    padding: 0 100px 0 34px;
-
-    span {
-      color: #18586e;
-      font-family: 'GT Eesti Pro Display';
-      font-size: 1.6em;
-      font-weight: 400;
-      font-style: normal;
-      letter-spacing: normal;
-      line-height: 16.81px;
-      text-align: left;
-    }
-  }
-
-  &__icon {
-    text-align: end;
-
-    img {
-      margin-left: 20px;
-    }
-  }
-
-  &__right {
     display: flex;
-    flex-direction: column;
+    align-items: center;
-    align-items: left;
+    column-gap: 13px;
+
+    p {
+      font-weight: 400;
+      font-size: 12px;
+      line-height: 16px;
+      color: #5B6871;
+    }
   }
 
-  &__phone {
+  &__policy {
-    color: #003b65;
-    font-family: 'CeraPro';
-    font-size: 2.1em;
-    letter-spacing: normal;
-    line-height: 25px;
-    text-align: left;
-  }
-
-  &__working-hours {
-    color: #003b65;
-    font-family: 'CeraPro';
-    font-size: 1.2em;
     font-weight: 400;
-    font-style: normal;
+    font-size: 10px;
-    letter-spacing: normal;
+    line-height: 16px;
-    line-height: normal;
+    color: #5B6871;
-    margin-left: 24px;
+    margin-left: 150px;
+
+    @media (max-width: 720px) {
+      margin-left: 30px;
+    }
+
+    &:hover {
+      color: #5B6871;
+      text-decoration: none;
+    }
   }
 
   &__copyright {
-    padding: 1rem 1rem 1rem 5.6rem;
+    margin-left: auto;
-    font-family: 'Muller';
-    font-weight: 300;
-    font-size: 1.2em;
-  }
-}
 
-@media (max-width: 1199px) {
+    @media (max-width: 910px) {
-  .footer {
+      min-width: 142px;
-    &__left {
+      margin-left: 15px;
-      margin-bottom: 20px;
+    }
+
+    @media (max-width: 620px) {
+      margin-left: 0;
     }
   }
+  //margin-top: -3rem;
+  //
+  //&__left {
+  //  display: flex;
+  //  align-items: center;
+  //}
+  //
+  //&__description {
+  //  padding: 0 100px 0 34px;
+  //
+  //  span {
+  //    color: #18586e;
+  //    font-family: 'GT Eesti Pro Display';
+  //    font-size: 1.6em;
+  //    font-weight: 400;
+  //    font-style: normal;
+  //    letter-spacing: normal;
+  //    line-height: 16.81px;
+  //    text-align: left;
+  //  }
+  //}
+  //
+  //&__icon {
+  //  text-align: end;
+  //
+  //  img {
+  //    margin-left: 20px;
+  //  }
+  //}
+  //
+  //&__right {
+  //  display: flex;
+  //  flex-direction: column;
+  //  align-items: left;
+  //}
+  //
+  //&__phone {
+  //  color: #003b65;
+  //  font-family: 'CeraPro';
+  //  font-size: 2.1em;
+  //  letter-spacing: normal;
+  //  line-height: 25px;
+  //  text-align: left;
+  //}
+  //
+  //&__working-hours {
+  //  color: #003b65;
+  //  font-family: 'CeraPro';
+  //  font-size: 1.2em;
+  //  font-weight: 400;
+  //  font-style: normal;
+  //  letter-spacing: normal;
+  //  line-height: normal;
+  //  margin-left: 24px;
+  //}
+  //
+  //&__copyright {
+  //  padding: 1rem 1rem 1rem 5.6rem;
+  //  font-family: 'Muller';
+  //  font-weight: 300;
+  //  font-size: 1.2em;
+  //}
 }
 
-@media (max-width: 575.98px) {
+//@media (max-width: 1199px) {
-  .footer {
+//  .footer {
-    &__left {
+//    &__left {
-      margin-top: 80px;
+//      margin-bottom: 20px;
-    }
+//    }
-
+//  }
-    &__description {
+//}
-      padding: 0;
+//
-      margin-left: 10px;
+//@media (max-width: 575.98px) {
-
+//  .footer {
-      span {
+//    &__left {
-        font-size: 1.2em;
+//      margin-top: 80px;
-      }
+//    }
-    }
+//
-
+//    &__description {
-    &__icon {
+//      padding: 0;
-      img {
+//      margin-left: 10px;
-        margin-left: 10px;
+//
-      }
+//      span {
-    }
+//        font-size: 1.2em;
-
+//      }
-    &__right {
+//    }
-      margin-bottom: 20px;
+//
-    }
+//    &__icon {
-  }
+//      img {
-}
+//        margin-left: 10px;
+//      }
+//    }
+//
+//    &__right {
+//      margin-bottom: 20px;
+//    }
+//  }
+//}

src/components/Outstaffing/Outstaffing.js

@@ -45,7 +45,7 @@ const Outstaffing = () => {
                     tagsArr.flat().filter((tag) => tag.name === 'skills_front')
                   }
                   img={front}
-                  header='Frontend'
+                  header='Frontend разработчики'
                   positionId='2'
                   isSelected={positionId === '2'}
                   onSelect={(id) => onSelectPosition(id)}
@@ -58,7 +58,7 @@ const Outstaffing = () => {
                     tagsArr.flat().filter((tag) => tag.name === 'skills_back')
                   }
                   img={back}
-                  header='Backend'
+                  header='Backend разработчики'
                   positionId='1'
                   isSelected={positionId === '1'}
                   onSelect={(id) => onSelectPosition(id)}
@@ -71,7 +71,7 @@ const Outstaffing = () => {
                     tagsArr.flat().filter((tag) => tag.name === 'skills_design')
                   }
                   img={design}
-                  header='Дизайн'
+                  header='Дизайн проектов'
                   positionId='5'
                   isSelected={positionId === '5'}
                   onSelect={(id) => onSelectPosition(id)}

src/components/OutstaffingBlock/outstaffingBlock.scss

@@ -1,7 +1,10 @@
+body {
+  font-family: 'LabGrotesque', sans-serif !important;
+}
+
 .container {
   max-width: 1160px !important;
 }
-
 .catalog {
   background: #F1F1F1;
   height: 100%;
@@ -54,15 +57,16 @@
 
     h3 {
       position: absolute;
-      right: 25%;
+      right: 13%;
-      top: 40%;
+      top: 30%;
+      max-width: 130px;
       font-family: 'GT Eesti Pro Display';
       font-size: 18px;
       font-weight: 400;
       font-style: normal;
       letter-spacing: normal;
       line-height: normal;
-      text-align: left;
+      text-align: center;
     }
 
     img {

src/components/ProfileHeader/ProfileHeader.js

@@ -9,6 +9,8 @@ import {getRole} from "../../redux/roleSlice";
 
 import {urlForLocal} from "../../helper";
 
+import avatarMok from "../../pages/PartnerTreaties/Images/avatarMok.png"
+
 import './profileHeader.scss'
 
 
@@ -129,7 +131,7 @@ export const ProfileHeader = () => {
                 }
               </h3>
               <NavLink end to={'/profile'}>
-                <img src={profileInfo.photo ? urlForLocal(profileInfo.photo) : ""} className='profileHeader__personalInfoAvatar' alt='avatar'/>
+                <img src={profileInfo.photo ? urlForLocal(profileInfo.photo) : avatarMok} className='profileHeader__personalInfoAvatar' alt='avatar'/>
               </NavLink>
             </div>
           </div>

src/images/emailLogo.svg

@@ -0,0 +1,11 @@
+<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_781_855)">
+<path d="M10.9611 22C4.91521 21.9955 -0.000747248 17.0751 8.5197e-08 11.0276C0.000747419 4.91671 4.89578 0 10.9798 0C17.084 0 22.0067 4.94062 21.9873 11.0478C21.9679 17.1109 17.0422 22.0037 10.9611 22ZM11.7272 13.0455C11.8348 13.2121 11.9065 13.3421 11.9969 13.458C12.2114 13.7337 12.4842 13.9168 12.8414 13.9482C14.002 14.0521 14.8966 13.5417 15.4235 12.4977C15.9122 11.5284 15.91 10.5023 15.7717 9.47021C15.5528 7.84177 14.8249 6.54664 13.2435 5.86956C12.4722 5.53998 11.6532 5.46973 10.8266 5.53326C9.08533 5.66703 7.76405 6.48685 6.91657 8.02188C6.08404 9.52925 5.98988 11.1554 6.27386 12.8078C6.4592 13.8862 6.93675 14.8488 7.82981 15.5296C9.22957 16.596 10.8005 16.6865 12.4386 16.241C13.0455 16.0759 13.0484 16.0251 12.8952 15.407C12.8399 15.1851 12.7742 15.1148 12.5432 15.2082C12.1741 15.357 11.784 15.4459 11.3871 15.4892C9.61818 15.6805 8.06746 14.9624 7.50622 13.0484C7.19906 12.0014 7.23195 10.9387 7.44793 9.87227C7.61533 9.04871 7.93369 8.30138 8.49494 7.67885C9.53896 6.52123 10.8715 6.31497 12.3205 6.61016C13.3279 6.81568 14.0402 7.41205 14.4318 8.37238C14.8742 9.4575 14.916 10.5755 14.6477 11.7017C14.5439 12.1382 14.3331 12.55 13.9288 12.7996C13.674 12.9573 13.3862 13.0866 13.0858 12.9244C12.8003 12.7697 12.8526 12.4745 12.8706 12.2211C12.9356 11.3281 13.0215 10.4365 13.0925 9.54419C13.1605 8.69522 13.1284 8.65113 12.3258 8.35668C12.2443 8.32679 12.1621 8.29391 12.0777 8.27597C11.1838 8.08988 10.3139 8.0996 9.67274 8.85889C8.69149 10.0202 8.40825 11.3796 8.77444 12.8407C8.97921 13.6575 9.70039 14.0648 10.5292 13.9318C11.0501 13.8481 11.4335 13.5409 11.7272 13.0447V13.0455Z" fill="#333333"/>
+<path d="M9.93954 11.713C9.96569 11.1645 10.0501 10.5636 10.2714 9.9904C10.5187 9.34918 10.9903 9.0794 11.645 9.17057C11.8437 9.19822 11.9327 9.27968 11.9132 9.4852C11.831 10.3626 11.766 11.2422 11.6696 12.1181C11.6195 12.5739 11.0979 12.982 10.6338 12.9775C10.3707 12.9752 10.1884 12.8527 10.077 12.6143C9.95149 12.3467 9.94552 12.0613 9.94028 11.713H9.93954Z" fill="#333333"/>
+</g>
+<defs>
+<clipPath id="clip0_781_855">
+<rect width="21.9873" height="22" fill="white"/>
+</clipPath>
+</defs>
+</svg>

src/images/tgLogo.svg

@@ -0,0 +1,3 @@
+<svg width="23" height="22" viewBox="0 0 23 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10.9458 21.9999C4.87316 21.97 -0.042627 16.9974 -3.04197e-05 10.927C0.0433134 4.86636 4.99647 -0.0300003 11.0541 -0.000107996C17.1156 0.0305316 22.0314 4.98444 22.0015 11.0346C21.9716 17.1245 17.0259 22.029 10.9465 21.9999H10.9458ZM16.0484 7.60226C16.0708 6.87961 15.81 6.633 15.2712 6.68232C14.9588 6.71072 14.6636 6.81235 14.3774 6.93192C12.3619 7.77488 10.3472 8.61785 8.33469 9.46754C7.12331 9.97944 5.91416 10.4966 4.71025 11.0257C4.48905 11.1228 4.25066 11.2529 4.27308 11.5667C4.2955 11.8746 4.56752 11.9232 4.77527 11.9934C5.37461 12.196 5.97843 12.3918 6.59272 12.5412C7.09939 12.6653 7.6113 12.6197 8.06267 12.317C9.56925 11.3067 11.0706 10.2896 12.5779 9.27996C12.7304 9.17833 12.9105 8.94367 13.0898 9.15292C13.2744 9.3674 13.0084 9.50266 12.8798 9.6297C11.8351 10.661 10.7806 11.6826 9.7359 12.7131C9.26808 13.1749 9.31367 13.6009 9.85696 13.9716C10.1544 14.1741 10.46 14.3654 10.7597 14.5664C11.5541 15.0992 12.3358 15.6523 13.1444 16.1627C14.0239 16.7179 14.4454 16.552 14.7473 15.585C14.7765 15.4908 14.8026 15.3944 14.8236 15.298C15.1315 13.9013 15.3243 12.4844 15.5462 11.0728C15.7375 9.85688 15.8989 8.63653 16.0469 7.60226H16.0484Z" fill="#333333"/>
+</svg>

src/images/vkLogo.svg

@@ -0,0 +1,11 @@
+<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_781_847)">
+<path d="M10.9754 22C4.91224 21.9881 -0.0231471 17.0228 2.01954e-05 10.9589C0.0231875 4.91 4.97203 -0.0119356 11.0194 2.17408e-05C17.0699 0.0119791 21.9993 4.95335 21.9955 11.003C21.9918 17.0743 17.0437 22.012 10.9754 22ZM11.4723 9.84166C11.4723 9.53076 11.4806 9.21913 11.4701 8.90824C11.4544 8.42621 11.3453 8.29393 10.8715 8.20798C10.2288 8.09215 9.58233 8.10336 8.93962 8.20873C8.77297 8.23638 8.60855 8.31336 8.45684 8.39332C8.28869 8.48151 8.26702 8.58987 8.47852 8.66012C8.78791 8.76325 8.99418 8.96653 9.04126 9.29162C9.12197 9.84689 9.16307 10.4044 9.05546 10.9634C8.95158 11.503 8.59734 11.6315 8.17734 11.2691C8.07496 11.1801 7.98752 11.0718 7.90008 10.9671C7.31791 10.2669 6.96367 9.44856 6.68342 8.59436C6.58403 8.29019 6.37627 8.13923 6.07733 8.134C5.45555 8.12279 4.83302 8.12129 4.21124 8.13998C3.84953 8.15119 3.76733 8.28645 3.91679 8.62126C4.63722 10.2355 5.43089 11.8101 6.52947 13.2084C7.66318 14.6515 9.10628 15.4354 10.9873 15.2972C11.3139 15.2733 11.5149 15.2045 11.4701 14.8226C11.4537 14.6784 11.482 14.5237 11.5157 14.3795C11.6233 13.9139 11.9207 13.7756 12.349 13.9841C12.6427 14.1276 12.893 14.3376 13.1269 14.5581C13.6897 15.0909 14.3301 15.3689 15.1201 15.2987C15.5154 15.2636 15.916 15.2927 16.3143 15.292C16.6386 15.292 17.0116 15.3241 17.1588 14.9684C17.3 14.6261 17.0108 14.3854 16.7956 14.1702C16.3023 13.6792 15.7837 13.2136 15.2867 12.7256C14.9467 12.3916 14.9273 12.1935 15.2045 11.8116C15.4818 11.4297 15.7889 11.0688 16.0767 10.6944C16.54 10.0913 16.966 9.465 17.1633 8.71617C17.2784 8.27898 17.2036 8.15567 16.7575 8.14521C15.9989 8.12802 15.2396 8.14297 14.4811 8.15119C14.2188 8.15418 14.0873 8.32307 14.0065 8.554C13.8787 8.91646 13.7569 9.28265 13.6037 9.63464C13.3339 10.2557 12.97 10.8192 12.4633 11.2758C12.2884 11.4335 12.0792 11.5874 11.8251 11.4963C11.5508 11.3984 11.4918 11.1368 11.4783 10.8849C11.4596 10.5374 11.4738 10.1884 11.4723 9.84016V9.84166Z" fill="#333333"/>
+<path d="M11.4731 9.84153C11.4731 10.1898 11.4596 10.5388 11.4783 10.8863C11.4918 11.1381 11.5516 11.3997 11.8251 11.4976C12.0792 11.588 12.2892 11.4341 12.4633 11.2772C12.97 10.8205 13.3332 10.257 13.6037 9.63601C13.7569 9.28402 13.8788 8.91782 14.0065 8.55537C14.088 8.32369 14.2188 8.15479 14.4811 8.15255C15.2396 8.14433 15.9989 8.13013 16.7575 8.14657C17.2036 8.15629 17.2791 8.2796 17.1633 8.71754C16.966 9.46636 16.54 10.0926 16.0767 10.6957C15.7889 11.0701 15.4818 11.4311 15.2045 11.813C14.9273 12.1956 14.9459 12.3929 15.2867 12.727C15.7837 13.215 16.3024 13.6806 16.7956 14.1716C17.0108 14.3861 17.3 14.6267 17.1588 14.9697C17.0123 15.3255 16.6394 15.2933 16.3143 15.2933C15.916 15.2933 15.5154 15.2649 15.1201 15.3C14.3301 15.3703 13.6904 15.0923 13.1269 14.5594C12.8938 14.3382 12.6434 14.129 12.349 13.9855C11.9207 13.7762 11.6233 13.9152 11.5157 14.3808C11.4821 14.5251 11.4537 14.6798 11.4701 14.824C11.5142 15.2059 11.3139 15.2746 10.9873 15.2986C9.10628 15.4368 7.66318 14.6529 6.52948 13.2098C5.4309 11.8115 4.63798 10.2369 3.9168 8.62262C3.76733 8.28782 3.84954 8.15255 4.21125 8.14134C4.83303 8.12266 5.45556 8.12415 6.07734 8.13536C6.37702 8.1406 6.58403 8.29156 6.68343 8.59572C6.96293 9.44992 7.31791 10.2683 7.90009 10.9685C7.98753 11.0739 8.07422 11.1822 8.17735 11.2704C8.5966 11.6329 8.95159 11.5051 9.05547 10.9648C9.16308 10.4058 9.12198 9.84825 9.04127 9.29298C8.99418 8.96715 8.78792 8.76387 8.47852 8.66149C8.26628 8.59124 8.2887 8.48287 8.45685 8.39469C8.60856 8.31472 8.77297 8.237 8.93963 8.2101C9.58159 8.10472 10.2288 8.09351 10.8715 8.20935C11.3453 8.29455 11.4544 8.42682 11.4701 8.9096C11.4798 9.22049 11.4723 9.53213 11.4723 9.84302L11.4731 9.84153Z" fill="#FBFBFB"/>
+</g>
+<defs>
+<clipPath id="clip0_781_847">
+<rect width="21.9955" height="22" fill="white"/>
+</clipPath>
+</defs>
+</svg>

src/pages/PartnerBid/PartnerBid.js

@@ -113,7 +113,7 @@ export const PartnerBid = () => {
                     </div>
                     <div className='partnerBid__suitable__persons'>
                         {mokPersons.map((person, index) => {
-                            return <div key={index} className='partnerBid__suitable__person'>
+                            return <Link to='/candidate/110' key={index} className='partnerBid__suitable__person'>
                                         <img src={person.img} alt='avatar' />
                                         <p>{person.name}</p>
                                         <Link className='partnerBid__suitable__person__more' to={person.link}>
@@ -122,7 +122,7 @@ export const PartnerBid = () => {
                                         <div className='partnerBid__suitable__person__info'>
 
                                         </div>
-                                    </div>
+                                    </Link>
                         })
                         }
                     </div>

src/pages/PartnerBid/partnerBid.scss

@@ -343,6 +343,10 @@
       background: #FFFFFF;
       border-radius: 12px;
 
+      &:hover {
+        text-decoration: none;
+      }
+
       img {
         width: 88px;
         height: 88px;

src/pages/PartnerEmployees/PartnerEmployees.js

@@ -42,9 +42,9 @@ export const PartnerEmployees = () => {
                                                 <div className="info_summary">
                                                     <img src={imgInfo} alt="img" />
                                                     <p>Данные и резюме</p>
-                                                    <div className="arrow">
+                                                    <Link to='/candidate/26' className="arrow">
                                                         <img src={rightArrow} alt="arrow" />
-                                                    </div>
+                                                    </Link>
                                                 </div>
                                             </div>
                                             <div className="partnerEmployees__item__info__project">

src/pages/PartnerEmployees/partnerEmployees.scss

@@ -50,11 +50,23 @@
     }
 
     &__info {
+      position: relative;
       display: flex;
       padding: 15px 50px 14px 16px;
       width: 100%;
       justify-content: space-between;
 
+      &:after {
+        content: '';
+        position: absolute;
+        background: #52B709;
+        border-radius: 12px;
+        height: 4px;
+        width: 51%;
+        top: 0;
+        right: 0;
+      }
+
       &__qualification {
         display: flex;
         flex-direction: column;

src/pages/Profile/Profile.js

@@ -15,6 +15,7 @@ import summaryIcon from "../../images/summaryIcon.png"
 import timerIcon from "../../images/timerIcon.png"
 import paymentIcon from "../../images/paymentIcon.png"
 import settingIcon from "../../images/settingIcon.png"
+import avatarMok from "../PartnerTreaties/Images/avatarMok.png"
 
 import rightArrow from "../../images/arrowRight.png"
 
@@ -105,7 +106,7 @@ export const Profile = () => {
           </h2>
           <div className='summary__info'>
             <div className='summary__person'>
-              <img src={profileInfo.photo ? urlForLocal(profileInfo.photo) : ''} className='summary__avatar' alt='avatar'/>
+              <img src={profileInfo.photo ? urlForLocal(profileInfo.photo) : avatarMok} className='summary__avatar' alt='avatar'/>
               <p className='summary__name'>
                 {user === 'developer' ?
                     <span>{profileInfo.fio}, {profileInfo.specification} разработчик</span>

src/pages/Summary/Summary.js

@@ -4,16 +4,17 @@ import {ProfileHeader} from "../../components/ProfileHeader/ProfileHeader";
 import {getProfileInfo} from "../../redux/outstaffingSlice";
 import {ProfileBreadcrumbs} from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs"
 import {Footer} from '../../components/Footer/Footer'
-import {transformHtml, urlForLocal} from "../../helper";
+import { urlForLocal} from "../../helper";
 
 import arrow from "../../images/right-arrow.png";
 import rightArrow from "../../images/arrowRight.png"
 import gitImgItem from "../../images/gitItemImg.png"
 
-import './summary.scss'
 import {apiRequest} from "../../api/request";
 import {Navigate} from "react-router-dom";
 
+import './summary.scss'
+
 export const Summary = () => {
     if(localStorage.getItem('role_status') === '18') {
         return <Navigate to="/profile" replace/>

src/pages/Tracker/tracker.scss

@@ -79,9 +79,9 @@
       background: white;
       border-radius: 12px 12px 5px 5px;
       position: relative;
-      height: 70px;
+      height: 73px;
       display: flex;
-      top: -10px;
+      top: -13px;
       align-items: center;
 
       p {