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

single report page and mobile avatar fix

Browse Source
This commit is contained in:
kurpfish
2021-09-28 12:46:16 +03:00
parent 69924802ba
commit 2bc1fb3570
10 changed files with 339 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Description/Description.js
View File

@@ -35,7 +35,7 @@ const Description = ({ onLoadMore, isLoadingMore }) => {
{
candidatesListArr && candidatesListArr.length > 0 ? candidatesListArr.map((el) => (
<div className="row" key={el.id}>
<div className="col-2">
<div className="col-2 col-xs-12">
<img className={style.description__img} src={el.photo} alt="" />
</div>
<div className="col-12 col-xl-6">

7
src/components/Description/Description.module.css
View File

@@ -30,8 +30,11 @@
@media (max-width: 575.98px) {
.description__img {
position: absolute;
top: 80px;
left: 0;
top: 100px;
left: calc(50% - 60px);
}
.description__wrapper {
padding: 45px 40px 0 40px;
}
}

16
src/components/TaskItem/TaskItem.js Normal file
View File

@@ -0,0 +1,16 @@
import React from 'react'
import './taskItem.scss'
export const TaskItem = ({ index, text, hours }) => {
return (
<div className='task-item'>
<div className='task-item__index'>{index}.</div>
<div className='task-item__text'>{text}</div>
<div className='task-item__hours'>
<div className='task-item__hours-value'>{hours}</div>
<div className='task-item__hours-text'>Количество часов</div>
</div>
</div>
)
}

72
src/components/TaskItem/taskItem.scss Normal file
View File

@@ -0,0 +1,72 @@
.task-item {
display: flex;
justify-content: flex-start;
align-items: center;
&__index {
margin-top: 0.2rem;
color: #282828;
font-family: 'GT Eesti Pro Display';
font-size: 20px;
font-weight: 700;
line-height: 48.74px;
text-align: left;
letter-spacing: 0.34px;
}
&__text {
min-width: 525px;
max-width: 525px;
margin-left: 1.6rem;
color: #000000;
font-family: 'GT Eesti Pro Display';
font-size: 15px;
font-weight: 400;
letter-spacing: normal;
line-height: normal;
text-align: left;
}
&__hours {
margin-left: 3.3rem;
display: flex;
&-value {
width: 34px;
height: 34px;
display: flex;
justify-content: center;
align-items: center;
box-shadow: 6px 5px 20px rgba(82, 151, 34, 0.21);
border-radius: 50%;
background-color: #ffffff;
background-image: linear-gradient(to top, #6aaf5c 0%, #52b709 100%),
linear-gradient(
36deg,
rgba(255, 255, 255, 0) 0%,
rgba(255, 255, 255, 0.16) 47%,
rgba(255, 255, 255, 0.17) 50%,
rgba(255, 255, 255, 0) 100%
);
color: #ffffff;
font-family: 'Muller Extra Bold';
font-size: 16px;
font-weight: 400;
text-align: left;
letter-spacing: 0.8px;
}
&-text {
margin-left: 1rem;
width: 69px;
height: 25px;
color: #000000;
font-family: 'GT Eesti Pro Display - Thin';
font-size: 13px;
font-weight: 400;
letter-spacing: normal;
line-height: normal;
text-align: left;
}
}
}