Create new component TrackerTagList

This commit is contained in:
MaxOvs19
2024-04-09 21:09:06 +03:00
parent 75cf13d945
commit 10ffb1f7f1
5 changed files with 419 additions and 383 deletions

View File

@ -361,132 +361,6 @@
}
}
&__executor {
display: flex;
align-items: center;
justify-content: space-between;
cursor: pointer;
margin-right: 10px;
border-radius: 8px;
border: 1px solid #e3e2e2;
padding: 2px 6px;
position: relative;
max-width: 190px;
width: 100%;
@media (max-width: 915px) {
margin-right: 0;
width: 100%;
max-width: none;
}
@media (max-width: 650px) {
border-color: gray;
}
&-selected {
display: flex;
align-items: center;
border-radius: 8px;
max-width: 220px;
width: 100%;
margin-right: 10px;
justify-content: center;
p {
color: #252c32;
font-weight: 400;
font-size: 14px;
line-height: 24px;
max-width: 155px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.avatar {
margin: 0 5px;
}
.delete {
cursor: pointer;
}
img {
display: flex;
width: 20px;
height: 20px;
}
@media (max-width: 915px) {
width: 100%;
max-width: none;
justify-content: start;
p {
font-size: 16px;
max-width: none;
}
}
}
p {
color: #252c32;
font-weight: 400;
font-size: 14px;
line-height: 24px;
}
img {
transition: all 0.15s ease;
margin-left: 5px;
}
.open {
transform: rotate(180deg);
}
&-dropdown {
position: absolute;
top: 33px;
left: 0;
background: white;
border-radius: 8px;
z-index: 5;
padding: 10px 10px;
display: flex;
flex-direction: column;
row-gap: 7px;
width: 100%;
.executor-dropdown__person {
display: flex;
justify-content: space-between;
align-items: center;
p {
max-width: 155px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
@media (max-width: 915px) {
max-width: none;
}
}
img {
width: 20px;
height: 20px;
}
&:hover {
p {
font-weight: 600;
}
}
}
}
}
&__back {
cursor: pointer;
display: flex;
@ -1958,7 +1832,7 @@
.table {
&__search {
display: flex;
background: #F0F2F5;
background: #f0f2f5;
border-radius: 5px;
width: 100%;
padding: 14px 12px;
@ -1976,11 +1850,11 @@
border: none;
outline: none;
font-size: 16px;
color: #9BABC5;
color: #9babc5;
width: 100%;
&::placeholder {
color: #9BABC5;
color: #9babc5;
}
}
}
@ -1995,12 +1869,12 @@
width: 32px;
border-radius: 5px;
height: 32px;
color: #2E3A59;
color: #2e3a59;
}
.switch {
border: none;
background: #F0F2F5;
background: #f0f2f5;
font-weight: 600;
}
@ -2016,12 +1890,12 @@
background: white;
.page {
border: 1px solid #E8ECF8;
border: 1px solid #e8ecf8;
background: none;
&--active {
border: none;
background: #9DA65D;
background: #9da65d;
color: white;
}
}
@ -2029,17 +1903,20 @@
}
table {
grid-template-columns: minmax(0px, 2fr) minmax(0px, 1fr) minmax(0px, 1fr) minmax(0px, 1fr);
grid-template-columns: minmax(0px, 2fr) minmax(0px, 1fr) minmax(0px, 1fr) minmax(
0px,
1fr
);
th {
border-top: none;
border-bottom: 1px solid #F5F6F8;
color: #2E3A59;
border-bottom: 1px solid #f5f6f8;
color: #2e3a59;
padding: 0 7.5px 15px;
}
td {
padding: 22px 7.5px;
color: #2E3A59;
color: #2e3a59;
border-top: none;
p {