Fixed project cart
This commit is contained in:
MaxOvs19
parent
a18229b56b
commit
c155462ab4
10
src/assets/icons/addProjectImg.svg
Normal file
10
src/assets/icons/addProjectImg.svg
Normal file
@ -0,0 +1,10 @@
|
||||
<svg width="46" height="46" viewBox="0 0 46 46" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1689_1894)">
|
||||
<path d="M38.91 7.09012C34.6905 2.87054 28.9675 0.5 23.0001 0.5C17.0327 0.5 11.3097 2.87054 7.09012 7.09012C2.87054 11.3097 0.5 17.0327 0.5 23.0001C0.5 28.9675 2.87054 34.6905 7.09012 38.91C11.3097 43.1296 17.0327 45.5002 23.0001 45.5002C28.9675 45.5002 34.6905 43.1296 38.91 38.91C43.1296 34.6905 45.5002 28.9675 45.5002 23.0001C45.5002 17.0327 43.1296 11.3097 38.91 7.09012ZM23.0001 42.336C12.3382 42.336 3.66414 33.662 3.66414 23.0001C3.66414 12.3382 12.3382 3.66414 23.0001 3.66414C33.6619 3.66414 42.336 12.3382 42.336 23.0001C42.336 33.662 33.6619 42.336 23.0001 42.336ZM33.9425 23.0001C33.9425 23.4197 33.7758 23.8221 33.4791 24.1187C33.1824 24.4154 32.78 24.5821 32.3604 24.5821H24.5821V32.3604C24.5821 32.78 24.4154 33.1824 24.1187 33.4791C23.8221 33.7758 23.4197 33.9425 23.0001 33.9425C22.5805 33.9425 22.1781 33.7758 21.8814 33.4791C21.5847 33.1824 21.4181 32.78 21.4181 32.3604V24.5821H13.6397C13.2202 24.5821 12.8178 24.4154 12.5211 24.1187C12.2244 23.8221 12.0577 23.4197 12.0577 23.0001C12.0577 22.5805 12.2244 22.1781 12.5211 21.8814C12.8178 21.5847 13.2202 21.4181 13.6397 21.4181H21.4181V13.6397C21.4181 13.2202 21.5847 12.8178 21.8814 12.5211C22.1781 12.2244 22.5805 12.0577 23.0001 12.0577C23.4197 12.0577 23.8221 12.2244 24.1187 12.5211C24.4154 12.8178 24.5821 13.2202 24.5821 13.6397V21.4181H32.3604C32.78 21.4181 33.1824 21.5847 33.4791 21.8814C33.7758 22.1781 33.9425 22.5805 33.9425 23.0001Z" fill="#8BCC60"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_1689_1894">
|
||||
<rect width="45" height="45" fill="white" transform="translate(0.5 0.5)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
@ -16,6 +16,7 @@ import archiveSet from "assets/icons/archive.svg";
|
||||
import del from "assets/icons/delete.svg";
|
||||
import edit from "assets/icons/edit.svg";
|
||||
import link from "assets/icons/link.svg";
|
||||
import avatarProject from "assets/images/avatarMok.png";
|
||||
|
||||
import "./projectTiket.scss";
|
||||
|
||||
@ -74,7 +75,9 @@ export const ProjectTiket = ({ project, index }) => {
|
||||
|
||||
return (
|
||||
<div className="project" key={index}>
|
||||
<Link to={`/tracker/project/${project.id}`}>{project.name}</Link>
|
||||
<Link to={`/tracker/project/${project.id}`} className="project__link">
|
||||
{project.name}
|
||||
</Link>
|
||||
<div className="project__info">
|
||||
<p>Открытые задачи</p>
|
||||
<span className="count">
|
||||
@ -84,10 +87,14 @@ export const ProjectTiket = ({ project, index }) => {
|
||||
0
|
||||
)}
|
||||
</span>
|
||||
<img src={avatarProject} alt="#" className="project__avatar" />
|
||||
<span className="menu-settings" onClick={() => setModalSelect(true)}>
|
||||
...
|
||||
</span>
|
||||
</div>
|
||||
<Link to={`#`} className="project__statistics">
|
||||
Просмотреть статистику
|
||||
</Link>
|
||||
|
||||
<TrackerModal
|
||||
active={modalAdd}
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
.project {
|
||||
position: relative;
|
||||
width: 48%;
|
||||
width: 322px;
|
||||
|
||||
background: #f1f1f1;
|
||||
border-radius: 12px;
|
||||
padding: 17px 26px 16px;
|
||||
@ -21,12 +22,12 @@
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
a {
|
||||
&__link {
|
||||
font-weight: 700;
|
||||
font-size: 18px;
|
||||
line-height: 32px;
|
||||
color: #111112;
|
||||
margin-bottom: 10px;
|
||||
margin-bottom: 22px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
display: flex;
|
||||
@ -42,19 +43,21 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
margin-bottom: 27px;
|
||||
|
||||
p {
|
||||
color: #6f6f6f;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
line-height: 24px;
|
||||
margin-bottom: 0;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
line-height: 17px;
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.count {
|
||||
margin-left: 8px;
|
||||
width: 21px;
|
||||
height: 24px;
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@ -84,4 +87,19 @@
|
||||
top: -35%;
|
||||
}
|
||||
}
|
||||
|
||||
&__avatar {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
margin-left: 56px;
|
||||
}
|
||||
|
||||
&__statistics {
|
||||
color: #678eda;
|
||||
margin-top: 27px;
|
||||
text-decoration: underline;
|
||||
font-size: 12px;
|
||||
font-weight: 300;
|
||||
line-height: 17px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -23,6 +23,7 @@ import { ProfileBreadcrumbs } from "@components/ProfileBreadcrumbs/ProfileBreadc
|
||||
import { ProfileHeader } from "@components/ProfileHeader/ProfileHeader";
|
||||
import ProjectTiket from "@components/ProjectTiket/ProjectTiket";
|
||||
|
||||
import addProjectImg from "assets/icons/addProjectImg.svg";
|
||||
import search from "assets/icons/serchIcon.png";
|
||||
import project from "assets/icons/trackerProject.svg";
|
||||
import tasks from "assets/icons/trackerTasks.svg";
|
||||
@ -205,17 +206,17 @@ export const Tracker = () => {
|
||||
setModalCreateProject(true);
|
||||
}}
|
||||
>
|
||||
<span>+</span>Создать проект
|
||||
<img src={addProjectImg} alt="#"></img>
|
||||
<p className="createProjectBtn__text">
|
||||
Ставьте задачи, следите за прогрессом, ведите учёт
|
||||
рабочего времени
|
||||
</p>
|
||||
</BaseButton>
|
||||
</div>
|
||||
<p className="no-projects__info">
|
||||
Ставьте задачи, следите за прогрессом, ведите учёт рабочего
|
||||
времени
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
{Boolean(projects.length) && !loader && (
|
||||
<div className="create-newProject">
|
||||
<>
|
||||
<BaseButton
|
||||
styles="createProjectBtn"
|
||||
onClick={() => {
|
||||
@ -223,13 +224,13 @@ export const Tracker = () => {
|
||||
setModalCreateProject(true);
|
||||
}}
|
||||
>
|
||||
<span>+</span>Создать проект
|
||||
<img src={addProjectImg} alt="#"></img>
|
||||
<p className="createProjectBtn__text">
|
||||
Ставьте задачи, следите за прогрессом, ведите учёт рабочего
|
||||
времени
|
||||
</p>
|
||||
</BaseButton>
|
||||
<p>
|
||||
Ставьте задачи, следите за прогрессом, ведите учёт рабочего
|
||||
времени
|
||||
</p>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
<div
|
||||
|
||||
@ -173,29 +173,33 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__info {
|
||||
margin-top: 27px;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
}
|
||||
}
|
||||
|
||||
.createProjectBtn {
|
||||
max-width: 188px;
|
||||
height: 50px;
|
||||
width: 100%;
|
||||
max-width: 322px;
|
||||
width: 322px;
|
||||
height: 166px;
|
||||
border-radius: 12px;
|
||||
background: #ecf8e5;
|
||||
color: #000000;
|
||||
font-weight: 400;
|
||||
font-size: 15px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: 0.4s;
|
||||
|
||||
span {
|
||||
margin-right: 9px;
|
||||
font-weight: 700;
|
||||
font-size: 18px;
|
||||
&__text {
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
font-weight: 250;
|
||||
width: 190px;
|
||||
margin-left: 25px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
transition: 0.4s;
|
||||
box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.11);
|
||||
}
|
||||
|
||||
@media (max-width: 650px) {
|
||||
@ -203,23 +207,6 @@
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.create-newProject {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
p {
|
||||
margin-left: 32px;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
max-width: 214px;
|
||||
|
||||
@media (max-width: 450px) {
|
||||
max-width: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__tasks {
|
||||
@ -243,7 +230,7 @@
|
||||
}
|
||||
|
||||
@media (max-width: 650px) {
|
||||
background-color: #DFF1FF;
|
||||
background-color: #dff1ff;
|
||||
}
|
||||
|
||||
&__wrapper {
|
||||
@ -699,7 +686,6 @@
|
||||
row-gap: 7px;
|
||||
width: 100%;
|
||||
|
||||
|
||||
.executorDropdown__person {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@ -710,7 +696,6 @@
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
|
||||
@media (max-width: 915px) {
|
||||
max-width: none;
|
||||
}
|
||||
@ -974,7 +959,7 @@
|
||||
p {
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
color: #1458DD;
|
||||
color: #1458dd;
|
||||
}
|
||||
|
||||
span {
|
||||
@ -1618,10 +1603,9 @@
|
||||
}
|
||||
|
||||
@media (max-width: 650px) {
|
||||
|
||||
&__content {
|
||||
padding: 28px 0 0;
|
||||
background-color: #DFF1FF;
|
||||
background-color: #dff1ff;
|
||||
|
||||
.project {
|
||||
background-color: white;
|
||||
@ -1630,15 +1614,15 @@
|
||||
}
|
||||
|
||||
.projectsTab {
|
||||
background-color: #DFF1FF;
|
||||
background-color: #dff1ff;
|
||||
}
|
||||
|
||||
.tasksTab {
|
||||
background-color: #E8FFEB;
|
||||
background-color: #e8ffeb;
|
||||
}
|
||||
|
||||
.archiveTab {
|
||||
background-color: #FFECEF;
|
||||
background-color: #ffecef;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user