add multiselect for files tanstak-table

This commit is contained in:
smanylov
2026-03-30 12:48:31 +07:00
parent 534e18bbd4
commit 154e9cc5c1
5 changed files with 175 additions and 30 deletions
+64 -26
View File
@@ -321,6 +321,7 @@
border-radius: 20px;
padding: 30px;
box-shadow: 0 4px 20px v.$shadow-1;
margin-bottom: 2rem;
h3 {
margin-bottom: 20px;
@@ -635,7 +636,7 @@
.table-filtres-text-filter {
background-color: #fff;
border: 2px solid #e2e8f0;
border: 2px solid v.$border-color-1;
border-radius: 12px;
justify-content: space-between;
align-items: center;
@@ -694,7 +695,7 @@
padding-right: 0.5rem;
padding-top: 0.25rem;
padding-bottom: 0.25rem;
border: 2px solid #e2e8f0;
border: 2px solid v.$border-color-1;
border-radius: 10px;
box-shadow: 0 1px 2px #0000000d;
color: v.$p-color;
@@ -721,7 +722,7 @@
gap: 0.25rem;
button {
border: 2px solid #e2e8f0;
border: 2px solid v.$border-color-1;
padding: 0.25rem 0.75rem;
border-radius: 10px;
color: v.$p-color;
@@ -947,6 +948,22 @@
}
}
}
.table-item-checkbox {
width: 16px;
height: 16px;
border-radius: 4px;
border: 2px solid v.$border-color-1;
cursor: pointer;
transition: all 0.3s ease-in;
display: flex;
justify-content: center;
align-items: center;
&:hover {
border: 2px solid v.$border-color-1-hover;
}
}
}
}
@@ -1117,7 +1134,7 @@
transition: all 0.3s ease;
position: relative;
overflow: hidden;
border: 2px solid #e2e8f0;
border: 2px solid v.$border-color-1;
&::before {
content: '';
@@ -1194,7 +1211,7 @@
display: flex;
flex: 1;
padding: 10px;
border: 2px solid #e2e8f0;
border: 2px solid v.$border-color-1;
border-radius: 12px;
font-size: 14px;
background: #f8f9fa;
@@ -1267,7 +1284,7 @@
.level-card {
background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
border: 2px solid #e2e8f0;
border: 2px solid v.$border-color-1;
border-radius: 16px;
padding: 18px;
text-align: center;
@@ -1704,7 +1721,7 @@
padding: 16px;
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
border-radius: 14px;
border: 1px solid #e2e8f0;
border: 1px solid v.$border-color-1;
transition: all 0.3s ease;
&:hover {
@@ -1984,7 +2001,7 @@
.progress-bar-container {
width: 100%;
height: 12px;
background: #e2e8f0;
background: v.$border-color-1;
border-radius: 6px;
overflow: hidden;
position: relative;
@@ -2082,7 +2099,7 @@
.country-bar {
width: 100%;
height: 5px;
background: #e2e8f0;
background: v.$border-color-1;
border-radius: 2.5px;
overflow: hidden;
}
@@ -2201,7 +2218,7 @@
border-radius: 16px;
overflow: hidden;
margin-bottom: 16px;
background: linear-gradient(135deg, #f1f5f9, #e2e8f0);
background: linear-gradient(135deg, #f1f5f9, v.$border-color-1);
display: flex;
align-items: center;
justify-content: center;
@@ -2257,7 +2274,7 @@
align-items: center;
justify-content: space-between;
padding-bottom: 12px;
border-bottom: 2px solid #e2e8f0;
border-bottom: 2px solid v.$border-color-1;
}
.violation-filename {
@@ -2555,7 +2572,7 @@
.case-card {
background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
border: 2px solid #e2e8f0;
border: 2px solid v.$border-color-1;
border-radius: 16px;
padding: 24px;
transition: all 0.3s ease;
@@ -2759,7 +2776,7 @@
border-radius: 16px;
overflow: hidden;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
border: 2px solid #e2e8f0;
border: 2px solid v.$border-color-1;
overflow: auto;
.violations-table {
@@ -2919,7 +2936,7 @@
width: 32px;
height: 32px;
border-radius: 8px;
border: 2px solid #e2e8f0;
border: 2px solid v.$border-color-1;
background: white;
font-size: 1rem;
cursor: pointer;
@@ -3587,7 +3604,7 @@
.file-info-card {
background: #ffffff;
border: 1px solid #e2e8f0;
border: 1px solid v.$border-color-1;
border-radius: 12px;
padding: 0;
overflow: hidden;
@@ -3602,7 +3619,7 @@
background: linear-gradient(0deg, #6366f1 50%, #8b5cf6 130%);
color: white;
padding: 16px 20px;
border-bottom: 1px solid #e2e8f0;
border-bottom: 1px solid v.$border-color-1;
h4 {
margin: 0;
@@ -4018,7 +4035,7 @@
margin-top: 10px;
.pagination-button {
border: 2px solid #e2e8f0;
border: 2px solid v.$border-color-1;
padding: 0.25rem 0.75rem;
border-radius: 10px;
color: v.$p-color;
@@ -4256,7 +4273,7 @@
justify-content: space-between;
margin-bottom: 20px;
padding-bottom: 15px;
border-bottom: 1px solid #e2e8f0;
border-bottom: 1px solid v.$border-color-1;
}
.info-row {
@@ -4292,7 +4309,7 @@
background: #f8fafc;
padding: 12px;
border-radius: 8px;
border: 1px solid #e2e8f0;
border: 1px solid v.$border-color-1;
margin-top: 10px;
word-break: break-all;
@@ -4309,7 +4326,7 @@
padding: 15px;
border-radius: 12px;
margin-top: 15px;
border: 1px solid #e2e8f0;
border: 1px solid v.$border-color-1;
text-align: left;
.notes-title {
@@ -4345,7 +4362,7 @@
padding: 15px;
border-radius: 12px;
text-align: center;
border: 1px solid #e2e8f0;
border: 1px solid v.$border-color-1;
}
.stat-mini-value {
@@ -4391,7 +4408,7 @@
color: #64748b;
&:hover {
background: #e2e8f0;
background: v.$border-color-1;
}
}
@@ -4409,7 +4426,7 @@
.source-card {
/* background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
border-radius: 12px;
border: 1px solid #e2e8f0; */
border: 1px solid v.$border-color-1; */
background: #fff;
border: 1px solid #f3f4f6;
@@ -4596,7 +4613,7 @@
}
&-title {
border-bottom: 1px solid #e2e8f0;
border-bottom: 1px solid v.$border-color-1;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
@@ -4646,7 +4663,7 @@
}
&-actions {
border-left: 1px solid #e2e8f0;
border-left: 1px solid v.$border-color-1;
padding-left: 15px;
}
@@ -4730,7 +4747,7 @@
width: 100%;
min-height: 80px;
padding: 12px;
border: 1px solid #e2e8f0;
border: 1px solid v.$border-color-1;
border-radius: 8px;
font-size: 14px;
font-family: inherit;
@@ -5008,4 +5025,25 @@
font-size: 12px;
}
}
}
.selected-files-wrapper {
position: fixed;
bottom: 40px;
left: calc(50% + (var(--side-bar-width) / 2));
transform: translateX(-50%);
display: flex;
gap: 10px;
background: v.$white;
border-radius: 20px;
padding: 20px 25px;
box-shadow: 0 4px 20px v.$shadow-1;
border: 1px solid v.$b-color-1;
.btn-primary {
background: #2b7fff;
padding: 10px 16px;
}
}