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

Fixed archive and select modal

Browse Source
This commit is contained in:
MaxOvs19 2023-10-10 19:29:08 +03:00
parent fe2c45cb22
commit be411ffef2
4 changed files with 95 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/Common/ModalLayout/modalLayout.scss
View File

@ -14,7 +14,7 @@
&__content {
position: relative;
background: linear-gradient(180deg, #ffffff 0%, #ebebeb 100%);
border-radius: 24px;
border-radius: 10px;
padding: 25px;
display: flex;
flex-direction: column;
@ -117,3 +117,17 @@
.modal-layout.active {
transform: scale(1);
}
.createProject {
background: linear-gradient(180deg, #fff 0%, #ebebeb 37.29%);
.title-project {
margin-top: 20px;
}
.button-add {
margin-top: 8px;
}
.exit {
top: 16px;
right: 15px;
}
}

4
src/components/Modal/ModalSelect/modalSelect.scss
View File

@ -5,13 +5,13 @@
background: #e1fccf;
border-radius: 12px;
transform: scale(0);
bottom: -148px;
bottom: -90px;
right: -120px;
@media (max-width: 1050px) {
right: 10px;
padding-top: 10px;
bottom: -160px;
bottom: -75px;
}
&-menu {

16
src/pages/Tracker/Tracker.js
View File

@ -24,6 +24,7 @@ import { ProfileHeader } from "@components/ProfileHeader/ProfileHeader";
import ProjectTiket from "@components/ProjectTiket/ProjectTiket";
import addProjectImg from "assets/icons/addProjectImg.svg";
import arrowViewReport from "assets/icons/arrows/arrowViewReport.svg";
import search from "assets/icons/serchIcon.png";
import project from "assets/icons/trackerProject.svg";
import tasks from "assets/icons/trackerTasks.svg";
@ -300,6 +301,21 @@ export const Tracker = () => {
{`${filterCompleteTasks.length}
${caseOfNum(filterCompleteTasks.length, "tasks")}`}
</p>
<div className="archive__tasks-period">
<div className="buttons-month">
<button>
<img src={arrowViewReport} alt="<"></img>
</button>
<button>
<img src={arrowViewReport} alt=">"></img>
</button>
</div>
<div className="month-period">
<h2>Сентябрь,</h2>
<h3>2023</h3>
</div>
</div>
<div className="archive__tasks__search">
<img src={search} alt="search" />
<input

76
src/pages/Tracker/tracker.scss
View File

@ -1356,23 +1356,25 @@
padding: 0 20px;
margin: 0 auto;
display: flex;
column-gap: 28px;
flex-direction: column;
@media (max-width: 1100px) {
flex-direction: column;
row-gap: 20px;
}
// column-gap: 28px;
@media (max-width: 650px) {
padding-bottom: 20px;
}
// @media (max-width: 1100px) {
// flex-direction: column;
// row-gap: 20px;
// }
// @media (max-width: 650px) {
// padding-bottom: 20px;
// }
.archive {
&__title {
padding-bottom: 8px;
display: flex;
align-items: center;
color: #1458dd;
color: #000;
min-height: 48px;
h3 {
@ -1406,7 +1408,7 @@
display: flex;
flex-direction: column;
row-gap: 15px;
max-height: 400px;
// max-height: 400px;
overflow-y: auto;
margin-right: -16px;
padding-right: 10px;
@ -1513,15 +1515,61 @@
}
&__tasks {
min-height: 400px;
max-height: 450px;
// min-height: 400px;
// max-height: 450px;
padding-right: 15px;
width: 65%;
// width: 65%;
@media (max-width: 1100px) {
width: 100%;
}
&-period {
display: flex;
align-items: center;
margin-left: 73px;
.buttons-month {
display: flex;
gap: 34px;
button {
width: 30px;
height: 30px;
background-color: #8dc63f;
border-radius: 15px;
border: none;
img {
width: 14px;
height: 14px;
}
&:first-child {
transform: rotate(-180deg);
}
}
}
.month-period {
display: flex;
flex-direction: row;
align-items: center;
margin-left: 62px;
h2 {
color: #1458dd;
}
h3 {
color: #252c32;
font-size: 18px;
font-weight: 700;
margin-left: 5px;
}
}
}
&__search {
margin-left: auto;
padding: 6px 12px;
@ -1569,7 +1617,7 @@
}
&__projects {
display: flex;
display: none;
flex-direction: column;
width: 33%;
min-height: 400px;