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

Fixed tags in tracker

Browse Source
This commit is contained in:
MaxOvs19 2023-11-09 21:03:19 +03:00
parent 63f46b080f
commit 7f751728a8
3 changed files with 44 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/assets/icons/crossWhite.svg Normal file
View File

@ -0,0 +1,10 @@
<svg width="7" height="6" viewBox="0 0 7 6" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1895_1196)">
<path d="M1.05915 4.7073e-05C1.1835 -0.00182845 1.25965 0.0525618 1.33035 0.123644C1.98754 0.782517 2.64585 1.44026 3.30378 2.09839C3.36443 2.15903 3.42482 2.15909 3.48496 2.09857C4.12958 1.45377 4.7742 0.808962 5.419 0.164343C5.59024 -0.00670482 5.74591 -0.00576705 5.92052 0.165844C6.03193 0.275375 6.14371 0.38453 6.25436 0.494624C6.41491 0.654606 6.41585 0.820965 6.25436 0.982823C5.59887 1.63926 4.94337 2.29532 4.28562 2.94931C4.23179 3.00295 4.22767 3.02977 4.2845 3.08623C4.93887 3.7346 5.59005 4.38634 6.24217 5.03696C6.42129 5.2157 6.42072 5.37062 6.24086 5.55067C6.13039 5.66114 6.02067 5.77217 5.90964 5.88208C5.75116 6.03868 5.58611 6.03868 5.42838 5.88114C4.77213 5.22564 4.11551 4.57071 3.46208 3.9124C3.40506 3.85501 3.37937 3.86063 3.32591 3.91465C2.67848 4.56583 2.02842 5.21439 1.37874 5.86351C1.19719 6.04487 1.0449 6.04525 0.865035 5.86576C0.75888 5.75979 0.652725 5.65382 0.546945 5.54767C0.370833 5.37118 0.369708 5.21476 0.543945 5.03959C1.19363 4.38691 1.84294 3.73347 2.49506 3.08304C2.54982 3.02846 2.55245 3.00183 2.49693 2.9465C1.83224 2.28613 1.17056 1.62294 0.508122 0.960317C0.331822 0.784018 0.330697 0.627036 0.504371 0.453175C0.621404 0.335954 0.739187 0.219671 0.855657 0.102076C0.917362 0.0394332 0.990133 0.00304792 1.05915 4.7073e-05Z" fill="white"/>
</g>
<defs>
<clipPath id="clip0_1895_1196">
<rect width="6.00113" height="6" fill="white" transform="translate(0.375)"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

3
src/components/Modal/Tracker/TrackerModal/TrackerModal.jsx
View File

@ -37,6 +37,7 @@ import arrowRight from "assets/icons/arrows/arrowRightCreateTask.svg";
import arrowDown from "assets/icons/arrows/selectArrow.png"; import arrowDown from "assets/icons/arrows/selectArrow.png";
import close from "assets/icons/close.png"; import close from "assets/icons/close.png";
import calendarImg from "assets/icons/createTaskCalendar.svg"; import calendarImg from "assets/icons/createTaskCalendar.svg";
import crossWhite from "assets/icons/crossWhite.svg";
import avatarMok from "assets/images/avatarMok.png"; import avatarMok from "assets/images/avatarMok.png";
import "./trackerModal.scss"; import "./trackerModal.scss";
@ -497,7 +498,7 @@ export const TrackerModal = ({
> >
<p>{tag.slug}</p> <p>{tag.slug}</p>
<img <img
src={close} src={crossWhite}
className="delete" className="delete"
alt="delete" alt="delete"
onClick={() => onClick={() =>

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

@ -390,11 +390,17 @@
row-gap: 8px; row-gap: 8px;
&__name { &__name {
color: #000;
font-size: 15px;
font-weight: 400;
line-height: normal;
cursor: pointer; cursor: pointer;
display: flex; display: flex;
align-items: center;
justify-content: space-between; justify-content: space-between;
padding: 5px; padding: 9.5px 12px;
border-radius: 8px; border-radius: 8px;
height: 47px;
border: 1px solid #e4e4e4; border: 1px solid #e4e4e4;
img { img {
@ -416,17 +422,18 @@
.selectedTag { .selectedTag {
display: flex; display: flex;
padding: 3px 5px 3px 8px; padding: 7px 7px 7px 8px;
border-radius: 8px; border-radius: 35px;
align-items: center; align-items: center;
column-gap: 8px; column-gap: 8px;
p { p {
font-weight: 600; color: #fff;
font-size: 15px; font-size: 13px;
font-style: normal;
font-weight: 500;
line-height: 0px;
margin: 0; margin: 0;
line-height: 15px;
color: white;
} }
.delete { .delete {
@ -447,41 +454,46 @@
border: 1px solid #e4e4e4; border: 1px solid #e4e4e4;
top: 90%; top: 90%;
z-index: 101; z-index: 101;
padding: 20px 10px 10px; padding: 30px 10px 10px;
background: white; background: #ebebeb;
row-gap: 8px; row-gap: 8px;
.close { .close {
position: absolute; position: absolute;
cursor: pointer; cursor: pointer;
width: 20px; width: 22px;
height: 20px; height: 22px;
right: 5px; right: 9px;
top: 0; top: 4px;
} }
.tag__item { .tag__item {
display: flex; display: flex;
align-items: center;
height: 42px;
background: white;
width: 100%; width: 100%;
cursor: pointer; cursor: pointer;
column-gap: 8px; column-gap: 8px;
padding: 5px; padding: 9px 14px;
border: 1px solid #ececec; border: 1px solid #ececec;
border-radius: 8px; border-radius: 8px;
justify-content: space-between; justify-content: space-between;
p { p {
font-size: 18px; color: #000;
font-weight: 500; font-size: 14px;
font-style: normal;
font-weight: 300;
line-height: 0px;
margin: 0; margin: 0;
line-height: 20px;
text-decoration: none; text-decoration: none;
} }
span { span {
width: 18px; width: 22px;
height: 18px; height: 23px;
border-radius: 50px; border-radius: 8px;
} }
} }