Fixed candidate pages
This commit is contained in:
parent
2e7375f18e
commit
b91c8acd0c
@ -1,12 +1,23 @@
|
||||
@use 'sass:math';
|
||||
@use "sass:math";
|
||||
|
||||
.candidate {
|
||||
padding-top: 23px;
|
||||
z-index: 0;
|
||||
|
||||
&__wrapper {
|
||||
background: #F1F1F1;
|
||||
background: #f1f1f1;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.profileBreadcrumbs {
|
||||
position: relative;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.row {
|
||||
position: relative;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
&__header {
|
||||
display: flex;
|
||||
@ -19,14 +30,21 @@
|
||||
}
|
||||
}
|
||||
|
||||
.col-xl-8 {
|
||||
position: relative;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
&__main {
|
||||
margin-top: 60px;
|
||||
position: relative;
|
||||
z-index: -1;
|
||||
|
||||
&-description {
|
||||
padding-left: 16px;
|
||||
|
||||
h2 {
|
||||
font-family: 'GT Eesti Pro Display', sans-serif;
|
||||
font-family: "GT Eesti Pro Display", sans-serif;
|
||||
font-size: 2.8em;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
@ -36,7 +54,7 @@
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: 'GT Eesti Pro Display', sans-serif;
|
||||
font-family: "GT Eesti Pro Display", sans-serif;
|
||||
font-size: 1.2em;
|
||||
font-weight: 300;
|
||||
font-style: normal;
|
||||
@ -50,7 +68,7 @@
|
||||
|
||||
&__text {
|
||||
p {
|
||||
font-family: 'GT Eesti Pro Display', sans-serif;
|
||||
font-family: "GT Eesti Pro Display", sans-serif;
|
||||
font-size: 1.6em;
|
||||
font-weight: 100;
|
||||
font-style: normal;
|
||||
@ -63,7 +81,7 @@
|
||||
}
|
||||
|
||||
&-secondary {
|
||||
font-family: 'GT Eesti Pro Display', sans-serif;
|
||||
font-family: "GT Eesti Pro Display", sans-serif;
|
||||
font-size: 1.6em;
|
||||
font-weight: 100;
|
||||
font-style: normal;
|
||||
@ -92,7 +110,7 @@
|
||||
position: absolute;
|
||||
right: 20%;
|
||||
top: 40%;
|
||||
font-family: 'GT Eesti Pro Display', sans-serif;
|
||||
font-family: "GT Eesti Pro Display", sans-serif;
|
||||
font-size: 1.8em;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
@ -112,7 +130,7 @@
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: #D3E4BC;
|
||||
background: #d3e4bc;
|
||||
border-radius: 50px;
|
||||
margin-right: 20px;
|
||||
|
||||
@ -122,7 +140,7 @@
|
||||
}
|
||||
&-sp {
|
||||
font-size: 12px;
|
||||
color: #5B6871;
|
||||
color: #5b6871;
|
||||
max-width: 75px;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
@ -133,6 +151,8 @@
|
||||
|
||||
footer {
|
||||
margin-top: 2.5rem !important;
|
||||
position: relative;
|
||||
z-index: -2;
|
||||
}
|
||||
}
|
||||
|
||||
@ -235,7 +255,7 @@
|
||||
rgba(255, 255, 255, 0) 100%
|
||||
);
|
||||
color: #ffffff;
|
||||
font-family: 'Muller', sans-serif;
|
||||
font-family: "Muller", sans-serif;
|
||||
font-size: 1.3em;
|
||||
letter-spacing: normal;
|
||||
border: none;
|
||||
@ -311,7 +331,6 @@
|
||||
top: 80px !important;
|
||||
}
|
||||
|
||||
|
||||
.candidate__works {
|
||||
@media (min-width: 576px) {
|
||||
padding: 0 0 45px 0;
|
||||
@ -331,7 +350,7 @@
|
||||
|
||||
&__info {
|
||||
width: 100%;
|
||||
background: #E1FCCF;
|
||||
background: #e1fccf;
|
||||
border-radius: 12px 12px 0px 0px;
|
||||
padding: 20px 0 20px 50px;
|
||||
|
||||
@ -355,7 +374,7 @@
|
||||
&__body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
height: 170px;
|
||||
padding: 25px 40px 25px 25px;
|
||||
border-radius: 12px;
|
||||
@ -376,7 +395,7 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50px;
|
||||
background: #DDEEC6;
|
||||
background: #ddeec6;
|
||||
margin: auto 0;
|
||||
}
|
||||
}
|
||||
@ -395,11 +414,10 @@
|
||||
width: 100%;
|
||||
height: 8px;
|
||||
border-radius: 12px;
|
||||
background: #D4F123;
|
||||
background: #d4f123;
|
||||
bottom: -36%;
|
||||
left: 10%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
&__project {
|
||||
|
@ -24,14 +24,27 @@ const getYearsString = (years) => {
|
||||
|
||||
const CandidateSidebar = ({ candidate, setActiveSnippet, activeSnippet }) => {
|
||||
const userId = localStorage.getItem("id");
|
||||
|
||||
const [addAspt, setAddAspt] = useState(false);
|
||||
|
||||
const showSnippet = () => {
|
||||
setActiveSnippet(!activeSnippet);
|
||||
};
|
||||
|
||||
const [addAspt, setAddAspt] = useState(false);
|
||||
let levelAspt = {
|
||||
spec: candidate.specification,
|
||||
skils: SKILLS[candidate.position_id],
|
||||
level: LEVELS[candidate.level],
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="candidate-sidebar">
|
||||
<ModalAspt
|
||||
active={addAspt}
|
||||
setActive={setAddAspt}
|
||||
level={levelAspt}
|
||||
></ModalAspt>
|
||||
|
||||
<div className="candidate-sidebar__info">
|
||||
<div className="candidate-sidebar__position">
|
||||
<h2>
|
||||
@ -49,8 +62,6 @@ const CandidateSidebar = ({ candidate, setActiveSnippet, activeSnippet }) => {
|
||||
</>
|
||||
)}
|
||||
|
||||
<ModalAspt active={addAspt} setActive={setAddAspt}></ModalAspt>
|
||||
|
||||
<button
|
||||
className="candidate-sidebar__select"
|
||||
onClick={() => setAddAspt(true)}
|
||||
@ -60,11 +71,8 @@ const CandidateSidebar = ({ candidate, setActiveSnippet, activeSnippet }) => {
|
||||
|
||||
{userId && (
|
||||
<>
|
||||
<Link to={`/${candidate.id}/calendar`}>
|
||||
<button className="candidate-sidebar__select">Отчёты</button>
|
||||
</Link>
|
||||
<button className="candidate-sidebar__select" onClick={showSnippet}>
|
||||
{activeSnippet ? "Показать" : "Скрыть"}
|
||||
{activeSnippet ? "Код разработчика" : "Скрыть"}
|
||||
</button>
|
||||
<div className="candidate-sidebar__achievements">
|
||||
{candidate &&
|
||||
|
@ -5,7 +5,7 @@
|
||||
border-radius: 12px;
|
||||
border-bottom: none !important;
|
||||
position: sticky;
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
top: 80px;
|
||||
|
||||
&__position {
|
||||
@ -13,7 +13,7 @@
|
||||
|
||||
h2 {
|
||||
font-size: 2.5rem;
|
||||
font-family: 'GT Eesti Pro Display', sans-serif;
|
||||
font-family: "GT Eesti Pro Display", sans-serif;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
letter-spacing: normal;
|
||||
@ -29,6 +29,7 @@
|
||||
}
|
||||
|
||||
&__info {
|
||||
padding-bottom: 40px;
|
||||
text-align: center;
|
||||
margin-top: 10px;
|
||||
width: 100%;
|
||||
@ -53,7 +54,7 @@
|
||||
}
|
||||
|
||||
.candidate-sidebar__experience-title {
|
||||
font-family: 'GT Eesti Pro Display', sans-serif;
|
||||
font-family: "GT Eesti Pro Display", sans-serif;
|
||||
font-size: 1.8em;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
@ -63,7 +64,7 @@
|
||||
}
|
||||
|
||||
.candidate-sidebar__experience {
|
||||
font-family: 'GT Eesti Pro Display', sans-serif;
|
||||
font-family: "GT Eesti Pro Display", sans-serif;
|
||||
font-size: 2.5em;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
@ -78,7 +79,7 @@
|
||||
border: none;
|
||||
background-color: #73c141;
|
||||
color: #ffffff;
|
||||
font-family: 'Muller', sans-serif;
|
||||
font-family: "Muller", sans-serif;
|
||||
font-size: 1.6em;
|
||||
font-style: normal;
|
||||
letter-spacing: normal;
|
||||
@ -95,7 +96,7 @@
|
||||
}
|
||||
|
||||
.candidate-sidebar__info__l {
|
||||
font-family: 'GT Eesti Pro Display', sans-serif;
|
||||
font-family: "GT Eesti Pro Display", sans-serif;
|
||||
font-size: 1.8em;
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
@ -134,7 +135,7 @@
|
||||
|
||||
.candidate-sidebar__arrows-sp {
|
||||
color: #705fa3;
|
||||
font-family: 'Circe', sans-serif;
|
||||
font-family: "Circe", sans-serif;
|
||||
font-size: 1.3em;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
|
@ -5,11 +5,12 @@ import logoTg from "../../../images/TgLogo.svg";
|
||||
import arrow from "../../../images/right-arrow.png";
|
||||
import interview from "../../../images/interviewLogo.svg";
|
||||
|
||||
import { Link } from "react-router-dom";
|
||||
import ModalAdd from "../ModalAdd/ModalAdd";
|
||||
|
||||
import "./modalAspt.scss";
|
||||
|
||||
export const ModalAspt = ({ active, setActive }) => {
|
||||
export const ModalAspt = ({ active, setActive, level }) => {
|
||||
const [date, setDate] = useState("");
|
||||
const [time, setTime] = useState("");
|
||||
const [modalSend, setModalSend] = useState(false);
|
||||
@ -36,13 +37,17 @@ export const ModalAspt = ({ active, setActive }) => {
|
||||
<div className="aspt-decs__avatar">
|
||||
<div className="aspt-decs__avatar_title">
|
||||
<img src={avatar}></img>
|
||||
<p>Full-stack Back end - разработчик, Senior</p>
|
||||
<p>
|
||||
{level.spec} {level.skils}, {level.level}{" "}
|
||||
</p>
|
||||
</div>
|
||||
<div className="aspt-decs__avatar_back">
|
||||
<Link to={"/profile/catalog"}>
|
||||
<div>
|
||||
<img src={arrow}></img>
|
||||
</div>
|
||||
<p>Вернуться к списку</p>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -56,9 +56,16 @@
|
||||
}
|
||||
|
||||
&_back {
|
||||
margin: 40px 0 0 0;
|
||||
|
||||
a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 40px 0 0 0;
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
color: #5b6871;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
div {
|
||||
background: #8dc63f;
|
||||
|
Loading…
Reference in New Issue
Block a user