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

Merge pull request #155 from apuc/fixed-pages

Browse Source 
Fixed pages (fixed design and bug tracker)
This commit is contained in:
MaxOvs19 2023-11-24 17:32:29 +03:00 committed by GitHub
commit 5bcaa9259e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 113 additions and 106 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -51,7 +51,7 @@
justify-content: space-between; justify-content: space-between;
button { button {
margin: 0 auto; // margin: 0 auto;
} }
} }
@ -74,7 +74,7 @@
} }
&__btn { &__btn {
margin: 0 auto; margin: 0;
max-width: 242px; max-width: 242px;
width: 100%; width: 100%;
} }
@ -106,7 +106,7 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
row-gap: 10px; row-gap: 10px;
padding: 39px 10px 29px 10px; padding: 19px 10px 29px 10px;
@media (max-width: 500px) { @media (max-width: 500px) {
padding: 10px; padding: 10px;

3
src/components/Modal/ModalRegistration/ModalRegistration.jsx
View File

@ -109,8 +109,7 @@ export const ModalRegistration = ({ active, setActive }) => {
Подключайтесь к <p>itguild.</p> Подключайтесь к <p>itguild.</p>
</h2> </h2>
<p className="registration-body__left-desc"> <p className="registration-body__left-desc">
Зарегистрируйтесь и назначайте собеседования любым специалистам без Зарегистрируйтесь и начните работу уже сегодня
задержек
</p> </p>
<div className="input-body"> <div className="input-body">

3
src/components/Modal/Tracker/ModalTicket/modalTicket.scss
View File

@ -1065,7 +1065,7 @@
background: #fff; background: #fff;
p { p {
font-size: 18px; font-size: 15px;
font-weight: 500; font-weight: 500;
margin: 0; margin: 0;
line-height: 20px; line-height: 20px;
@ -1097,7 +1097,6 @@
border-radius: 10px; border-radius: 10px;
margin-bottom: 10px; margin-bottom: 10px;
.priority { .priority {
&__name { &__name {
cursor: pointer; cursor: pointer;
width: 100%; width: 100%;

1
src/components/Modal/Tracker/TrackerModal/trackerModal.scss
View File

@ -233,6 +233,7 @@
text-overflow: ellipsis; text-overflow: ellipsis;
font-size: 14px; font-size: 14px;
max-width: 270px; max-width: 270px;
margin-left: 10px;
} }
img { img {

2
src/components/ProjectTiket/ProjectTiket.jsx
View File

@ -81,7 +81,7 @@ export const ProjectTiket = ({ project, index }) => {
to={`/tracker/project/${project.id}`} to={`/tracker/project/${project.id}`}
className="project__open-traker" className="project__open-traker"
> >
<p className="project__link">{project.name}</p> <div className="project__link">{project.name}</div>
<div className="project__info"> <div className="project__info">
<p>Открытые задачи</p> <p>Открытые задачи</p>

8
src/components/ProjectTiket/projectTiket.scss
View File

@ -26,14 +26,14 @@
&__link { &__link {
font-weight: 700; font-weight: 700;
width: 194px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 18px; font-size: 18px;
line-height: 32px; line-height: 32px;
color: #111112; color: #111112;
margin-bottom: 22px; margin-bottom: 22px;
overflow: hidden;
white-space: nowrap;
display: flex;
text-overflow: ellipsis;
max-width: 380px; max-width: 380px;
&:hover { &:hover {

52
src/pages/ProjectTracker/ProjectTracker.js
View File

@ -414,6 +414,11 @@ export const ProjectTracker = () => {
add: false, add: false,
edit: false, edit: false,
}); });
setTagInfo({
description: "",
name: "",
});
setColor("#aabbcc");
} }
if ( if (
@ -703,23 +708,19 @@ export const ProjectTracker = () => {
</div> </div>
{tags.open && ( {tags.open && (
<div className="tags__list"> <div className="tags__list">
<img <div
src={close} className="addNewTag"
className="close" onClick={() =>
alt="close" setTags((prevState) => ({
onClick={() => { ...prevState,
setTags({ add: true,
open: false, }))
add: false, }
edit: false, >
}); <p>Добавить новый тег</p>
setTagInfo({ <span>+</span>
description: "", </div>
name: "",
});
setColor("#aabbcc");
}}
/>
{!tags.add && !tags.edit && ( {!tags.add && !tags.edit && (
<div className="tags__list__created"> <div className="tags__list__created">
{projectBoard.mark.map((tag) => { {projectBoard.mark.map((tag) => {
@ -736,8 +737,8 @@ export const ProjectTracker = () => {
className="tagItem__info__color" className="tagItem__info__color"
style={{ background: tag.color }} style={{ background: tag.color }}
/> />
</div>
<div className="tagItem__images"> <div className="tagItem__info__images">
<img <img
src={edit} src={edit}
alt="edit" alt="edit"
@ -762,20 +763,9 @@ export const ProjectTracker = () => {
/> />
</div> </div>
</div> </div>
</div>
); );
})} })}
<div
className="addNewTag"
onClick={() =>
setTags((prevState) => ({
...prevState,
add: true,
}))
}
>
<p>Добавить новый тег</p>
<span>+</span>
</div>
</div> </div>
)} )}
{(tags.add || tags.edit) && ( {(tags.add || tags.edit) && (

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

@ -390,8 +390,8 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
background: linear-gradient(180deg, #ffffff 0%, #ebebeb 100%); background: linear-gradient(180deg, #ffffff 0%, #ebebeb 100%);
border-radius: 40px; border-radius: 20px;
padding: 15px 30px; padding: 30px;
cursor: default; cursor: default;
width: 800px; width: 800px;
@ -493,6 +493,7 @@
&__add { &__add {
display: flex; display: flex;
margin-left: 3px;
cursor: pointer; cursor: pointer;
span { span {
@ -513,7 +514,8 @@
@media (max-width: 1000px) { @media (max-width: 1000px) {
width: 390px; width: 390px;
padding: 15px 30px; padding: 30px;
.persons__list__info { .persons__list__info {
margin: 10px; margin: 10px;
} }
@ -755,16 +757,18 @@
margin: 0 10px; margin: 0 10px;
column-gap: 5px; column-gap: 5px;
cursor: pointer; cursor: pointer;
padding: 4px; padding: 5px 20px;
border-radius: 8px; border-radius: 8px;
border: 1px solid #e3e2e2; border: 1px solid #e3e2e2;
max-height: 30px; max-height: 30px;
p { p {
white-space: nowrap; white-space: nowrap;
font-weight: 400; font-weight: 400;
font-size: 14px; font-size: 14px;
line-height: 17px; line-height: 17px;
} }
span { span {
width: 14px; width: 14px;
height: 14px; height: 14px;
@ -782,12 +786,13 @@
} }
&__list { &__list {
position: absolute; position: absolute;
background: #f8f9fa; border-radius: 2px;
background: #d9d9d9;
z-index: 8; z-index: 8;
border-radius: 8px;
padding: 20px 10px 10px; // padding: 0 8px 10px;
top: 30px; top: 30px;
width: 220px; width: 265px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -805,17 +810,27 @@
flex-direction: column; flex-direction: column;
row-gap: 8px; row-gap: 8px;
margin-top: 8px; margin-top: 8px;
padding: 0 8px 8px;
.tagItem { .tagItem {
position: relative;
display: flex; display: flex;
flex-direction: column; align-items: center;
padding: 5px; flex-direction: row;
border: 1px solid #e3e2e2; justify-content: space-between;
padding: 0px 8px;
border-radius: 8px; border-radius: 8px;
height: 50px;
max-height: 50px;
background: #fff;
&__description { &__description {
font-size: 14px; font-size: 12px;
word-break: break-word;
max-width: 115px;
max-height: 40px;
overflow: hidden;
text-wrap: wrap;
text-overflow: ellipsis;
} }
&__info { &__info {
@ -824,24 +839,20 @@
column-gap: 10px; column-gap: 10px;
&__name { &__name {
font-size: 16px; font-size: 12px;
font-weight: 600; font-weight: 600;
} }
&__color { &__color {
border: 1px solid #e3e2e2; width: 22.25px;
width: 20px; height: 23.217px;
height: 20px; border-radius: 8px;
border-radius: 50px;
}
} }
&__images { &__images {
position: absolute;
right: 5px;
top: 3px;
display: flex; display: flex;
column-gap: 3px; flex-direction: column-reverse;
row-gap: 6px;
img { img {
cursor: pointer; cursor: pointer;
@ -854,21 +865,26 @@
} }
} }
} }
}
.addNewTag { .addNewTag {
display: flex; display: flex;
align-items: center; align-items: center;
column-gap: 8px; column-gap: 15px;
border-radius: 8px;
background: #252c32;
color: white;
height: 42px;
cursor: pointer; cursor: pointer;
justify-content: center; justify-content: center;
p { p {
font-size: 13px; font-size: 15px;
} }
span { span {
width: 16px; width: 19px;
height: 16px; height: 19px;
border-radius: 50px; border-radius: 50px;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@ -883,8 +899,9 @@
.formTag { .formTag {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding-top: 8px; padding: 8px;
row-gap: 8px; row-gap: 8px;
.arrow { .arrow {
position: absolute; position: absolute;
cursor: pointer; cursor: pointer;
@ -905,11 +922,12 @@
&__btn { &__btn {
outline: none; outline: none;
border: none; border: none;
background: #6f6f6f; background: #252c32;
color: whitesmoke; color: whitesmoke;
margin: 0 auto; margin: 10px auto 0;
border-radius: 10px; border-radius: 10px;
font-size: 15px; font-size: 15px;
padding: 5px 12px;
} }
.disable { .disable {
@ -1130,7 +1148,6 @@
align-items: center; align-items: center;
margin-bottom: 8px; margin-bottom: 8px;
p { p {
font-weight: 500; font-weight: 500;
font-size: 14px; font-size: 14px;
@ -1317,6 +1334,7 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
min-width: 300px; min-width: 300px;
padding-left: 18px;
&__more { &__more {
display: flex; display: flex;