apuc/guild_front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

quiz

Browse Source
This commit is contained in:
Дмитрий Кравцов
2022-05-27 14:39:05 +03:00
parent f7367dbdf2
commit e9e3880ad3
26 changed files with 718 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/components/Candidate/Candidate.js
View File

@ -18,12 +18,15 @@ import { Footer } from '../Footer/Footer'
import './candidate.scss'
import { getRole } from '../../redux/roleSlice'
import { CodeSnippetlighter } from '../../pages/CodeSnippetPage'
import { useState } from 'react'
const Candidate = () => {
const history = useHistory()
const { id: candidateId } = useParams()
const dispatch = useDispatch()
const role = useSelector(getRole)
const [activeSnippet, setActiveSnippet] = useState(true)
useEffect(() => {
window.scrollTo(0, 0)
@ -117,8 +120,11 @@ const Candidate = () => {
<div className='candidate__main'>
<div className='row'>
<div className='col-12 col-xl-4'>
<Sidebar candidate={currentCandidateObj} position />
<Sidebar candidate={currentCandidateObj} position activeSnippet={activeSnippet} setActiveSnippet={setActiveSnippet}/>
</div>
{
activeSnippet ?
(
<div className='col-12 col-xl-8'>
<div className='candidate__main-description'>
<img src={rectangle} alt='' />
@ -141,8 +147,44 @@ const Candidate = () => {
</button>
</Link> */}
<SkillSection skillsArr={skillValues} />
</div>
</div>
) :
(
// <div className="col-12 col-xl-8">
// <CodeSnippetlighter />
// </div>
<div className="col-12 col-xl-8">
<div className="candidate__works works">
<div className="works__body">
<div className="works__item item-works">
<div className="item-works__body">
<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 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 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 item-works__mark_yellow">Laravel</div>
</div>
</div>
</div>
</div>
</div>
)
}
</div>
</div>
<Footer />

83
src/components/Candidate/candidate.scss
View File

@ -1,3 +1,4 @@
@use 'sass:math';
.candidate {
&__title {
margin-top: 60px;
@ -291,3 +292,85 @@
.candidate + .logout-button {
top: 80px !important;
}
.candidate__works{
@media (min-width: 576px) {
padding: 0 0 45px 0;
}
}
.works__body{
display: flex;
flex-wrap: wrap;
margin: 0 -15px -30px;
}
.item-works{
display: flex;
flex-direction: column;
padding: 0 15px;
margin: 0 0 30px 0;
flex: 0 1 50%;
position: relative;
@media (max-width: 761px) {
flex: 0 1 100%;
}
&__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";
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";
font-size: 12px;
font-weight: 400;
line-height: math.div(18,12);
}
&__mark{
font-size: 13px;
display: flex;
align-items: center;
column-gap: 7px;
line-height: math.div(36,13);
&::before{
border-radius: 50%;
content: "";
width: 13px;
height: 13px;
background-color: #73c141;
}
&_yellow{
&::before{
background-color: #e09f14;
}
}
}
}