urfu-ui-kit-vanilla 1.0.8 → 1.0.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/playground/index.html +10 -9
- package/src/main.css +70 -17
- package/src/styles/components/button.less +3 -1
- package/src/styles/components/checkbox.less +1 -1
- package/src/styles/components/input.less +30 -2
- package/src/styles/components/tab.less +7 -18
- package/src/styles/components/table.less +8 -2
package/package.json
CHANGED
package/playground/index.html
CHANGED
|
@@ -31,13 +31,13 @@
|
|
|
31
31
|
<p>Сроки</p>
|
|
32
32
|
</th>
|
|
33
33
|
<th>
|
|
34
|
-
|
|
34
|
+
<p>ФИО</p>
|
|
35
35
|
</th>
|
|
36
36
|
<th>
|
|
37
37
|
<p>Статус заявки</p>
|
|
38
38
|
</th>
|
|
39
39
|
<th>
|
|
40
|
-
|
|
40
|
+
<p>Статус заявки</p>
|
|
41
41
|
</th>
|
|
42
42
|
<th>
|
|
43
43
|
<p>Статус отчета</p>
|
|
@@ -117,19 +117,19 @@
|
|
|
117
117
|
<div>222 <br>435 <br>435 <br>435 <br>435</div>
|
|
118
118
|
</td>
|
|
119
119
|
<td>
|
|
120
|
-
<div>
|
|
120
|
+
<div>333fdgfdfgsdgsgsdgsg</div>
|
|
121
121
|
</td>
|
|
122
122
|
<td>
|
|
123
123
|
<div>444</div>
|
|
124
124
|
</td>
|
|
125
125
|
<td>
|
|
126
|
-
<div>
|
|
126
|
+
<div>55gsdfdsfsdfsdfsdfsdfsfsdfsdfsdffgsfgsg5</div>
|
|
127
127
|
</td>
|
|
128
128
|
<td>
|
|
129
|
-
<div>
|
|
129
|
+
<div>66sgsdgsdgsd6</div>
|
|
130
130
|
</td>
|
|
131
131
|
<td>
|
|
132
|
-
<div>
|
|
132
|
+
<div>77gsdgdsgsdgsfdfsdgsd7</div>
|
|
133
133
|
</td>
|
|
134
134
|
<td>
|
|
135
135
|
<div>888</div>
|
|
@@ -138,7 +138,7 @@
|
|
|
138
138
|
<div><span>999</span></div>
|
|
139
139
|
</td>
|
|
140
140
|
<td>
|
|
141
|
-
<div><span>
|
|
141
|
+
<div><span>00gsdgdsgsgs0</span></div>
|
|
142
142
|
</td>
|
|
143
143
|
</tr>
|
|
144
144
|
</tbody>
|
|
@@ -384,8 +384,9 @@
|
|
|
384
384
|
</div>
|
|
385
385
|
<div class="u-selectbox">
|
|
386
386
|
<div class="u-selectbox-select">
|
|
387
|
-
<span
|
|
388
|
-
<i class="u-selectbox-select-icon"></i>
|
|
387
|
+
<span class="u-selectbox-select-title">Выбрать324 23 42342342342342342 34234 2342344 23 42342342342342342 34234 234234234234 23 4234 23 42342342342342342 34234 234234234234 23 4234 23 42342342342342342 34234 234234234234 23 4234 23 42342342342342342 34234 234234234234 23 4234 23 42342342342342342 34234 234234234234 23 423234234 23 4234 24 23424234242342234</span>
|
|
388
|
+
<i class="u-selectbox-select-icon-cross"></i>
|
|
389
|
+
<i class="u-selectbox-select-icon-arrow"></i>
|
|
389
390
|
</div>
|
|
390
391
|
<div class="u-selectbox-options">
|
|
391
392
|
<div class="u-selectbox-option">раз</div>
|
package/src/main.css
CHANGED
|
@@ -72,6 +72,7 @@
|
|
|
72
72
|
border: none;
|
|
73
73
|
font-weight: 500;
|
|
74
74
|
font-size: 13px;
|
|
75
|
+
white-space: nowrap;
|
|
75
76
|
cursor: pointer;
|
|
76
77
|
transition-property: color, background-color, border-color, background-image;
|
|
77
78
|
transition-duration: 0.15s;
|
|
@@ -168,6 +169,7 @@
|
|
|
168
169
|
border: none;
|
|
169
170
|
font-weight: 500;
|
|
170
171
|
font-size: 13px;
|
|
172
|
+
white-space: nowrap;
|
|
171
173
|
cursor: pointer;
|
|
172
174
|
transition-property: color, background-color, border-color, background-image;
|
|
173
175
|
transition-duration: 0.15s;
|
|
@@ -195,6 +197,8 @@
|
|
|
195
197
|
font-weight: 600;
|
|
196
198
|
font-size: 14px;
|
|
197
199
|
background: none;
|
|
200
|
+
align-items: center;
|
|
201
|
+
white-space: nowrap;
|
|
198
202
|
cursor: pointer;
|
|
199
203
|
transition-property: color, background-color, border-color, background-image;
|
|
200
204
|
transition-duration: 0.15s;
|
|
@@ -211,7 +215,6 @@
|
|
|
211
215
|
}
|
|
212
216
|
.u-button-text .u-icon {
|
|
213
217
|
position: relative;
|
|
214
|
-
top: 3px;
|
|
215
218
|
margin-left: 8px;
|
|
216
219
|
}
|
|
217
220
|
.u-button-text .u-icon::before {
|
|
@@ -247,6 +250,8 @@
|
|
|
247
250
|
font-size: 14px;
|
|
248
251
|
line-height: 20px;
|
|
249
252
|
color: #222222;
|
|
253
|
+
background-color: #FFFFFF;
|
|
254
|
+
width: 100%;
|
|
250
255
|
transition-property: color, background-color, border-color, background-image;
|
|
251
256
|
transition-duration: 0.15s;
|
|
252
257
|
transition-timing-function: ease-in-out;
|
|
@@ -330,19 +335,24 @@
|
|
|
330
335
|
font-size: 14px;
|
|
331
336
|
line-height: 20px;
|
|
332
337
|
color: #222222;
|
|
338
|
+
background-color: #FFFFFF;
|
|
339
|
+
width: 100%;
|
|
333
340
|
transition-property: color, background-color, border-color, background-image;
|
|
334
341
|
transition-duration: 0.15s;
|
|
335
342
|
transition-timing-function: ease-in-out;
|
|
336
343
|
border: 1px solid #EF302B;
|
|
337
344
|
}
|
|
338
345
|
.u-input-required:hover,
|
|
339
|
-
.u-input-required:focus,
|
|
340
346
|
.u-input-required.active {
|
|
341
347
|
border: 1px solid #748AB9;
|
|
342
348
|
}
|
|
343
349
|
.u-input-required::placeholder {
|
|
344
350
|
color: #A7A7A7;
|
|
345
351
|
}
|
|
352
|
+
.u-input-required:focus {
|
|
353
|
+
outline: 0;
|
|
354
|
+
border: 1px solid #748AB9;
|
|
355
|
+
}
|
|
346
356
|
.u-number {
|
|
347
357
|
display: inline-block;
|
|
348
358
|
position: relative;
|
|
@@ -403,6 +413,8 @@
|
|
|
403
413
|
font-size: 14px;
|
|
404
414
|
line-height: 20px;
|
|
405
415
|
color: #222222;
|
|
416
|
+
background-color: #FFFFFF;
|
|
417
|
+
width: 100%;
|
|
406
418
|
transition-property: color, background-color, border-color, background-image;
|
|
407
419
|
transition-duration: 0.15s;
|
|
408
420
|
transition-timing-function: ease-in-out;
|
|
@@ -487,19 +499,24 @@
|
|
|
487
499
|
font-size: 14px;
|
|
488
500
|
line-height: 20px;
|
|
489
501
|
color: #222222;
|
|
502
|
+
background-color: #FFFFFF;
|
|
503
|
+
width: 100%;
|
|
490
504
|
transition-property: color, background-color, border-color, background-image;
|
|
491
505
|
transition-duration: 0.15s;
|
|
492
506
|
transition-timing-function: ease-in-out;
|
|
493
507
|
border: 1px solid #EF302B;
|
|
494
508
|
}
|
|
495
509
|
.u-selectbox-select-required:hover,
|
|
496
|
-
.u-selectbox-select-required:focus,
|
|
497
510
|
.u-selectbox-select-required.active {
|
|
498
511
|
border: 1px solid #748AB9;
|
|
499
512
|
}
|
|
500
513
|
.u-selectbox-select-required::placeholder {
|
|
501
514
|
color: #A7A7A7;
|
|
502
515
|
}
|
|
516
|
+
.u-selectbox-select-required:focus {
|
|
517
|
+
outline: 0;
|
|
518
|
+
border: 1px solid #748AB9;
|
|
519
|
+
}
|
|
503
520
|
.u-selectbox-select-open {
|
|
504
521
|
border: 1px solid #748AB9;
|
|
505
522
|
}
|
|
@@ -509,7 +526,7 @@
|
|
|
509
526
|
.u-selectbox-select-open + .u-selectbox-options {
|
|
510
527
|
display: block;
|
|
511
528
|
}
|
|
512
|
-
.u-selectbox-select-icon {
|
|
529
|
+
.u-selectbox-select-icon-arrow {
|
|
513
530
|
position: absolute;
|
|
514
531
|
display: block;
|
|
515
532
|
background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.292892 4.29289C0.683416 3.90237 1.31658 3.90237 1.70711 4.29289L6.00001 8.58579L10.2929 4.29289C10.6834 3.90237 11.3166 3.90237 11.7071 4.29289C12.0976 4.68342 12.0976 5.31658 11.7071 5.70711L6.70712 10.7071C6.51958 10.8946 6.26523 11 6.00001 11C5.73479 11 5.48044 10.8946 5.2929 10.7071L0.292894 5.70711C-0.0976308 5.31658 -0.0976314 4.68342 0.292892 4.29289Z' fill='%231E4391'/%3E%3C/svg%3E ");
|
|
@@ -519,6 +536,29 @@
|
|
|
519
536
|
right: 20px;
|
|
520
537
|
top: calc(50% - 7px);
|
|
521
538
|
}
|
|
539
|
+
.u-selectbox-select-icon-cross {
|
|
540
|
+
position: absolute;
|
|
541
|
+
display: block;
|
|
542
|
+
background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11.3386 0.661444C11.7039 1.02675 11.7039 1.61903 11.3386 1.98433L1.98434 11.3386C1.61904 11.7039 1.02676 11.7039 0.661455 11.3386C0.29615 10.9733 0.296149 10.381 0.661454 10.0157L10.0157 0.661444C10.381 0.296138 10.9733 0.296138 11.3386 0.661444Z' fill='%23A7A7A7'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.661432 0.661444C1.02674 0.296138 1.61901 0.296138 1.98432 0.661444L11.3385 10.0157C11.7039 10.381 11.7038 10.9733 11.3385 11.3386C10.9732 11.7039 10.381 11.7039 10.0157 11.3386L0.661432 1.98433C0.296127 1.61903 0.296127 1.02675 0.661432 0.661444Z' fill='%23A7A7A7'/%3E%3C/svg%3E ");
|
|
543
|
+
background-repeat: no-repeat;
|
|
544
|
+
width: 12px;
|
|
545
|
+
height: 12px;
|
|
546
|
+
right: 44px;
|
|
547
|
+
top: calc(50% - 5px);
|
|
548
|
+
transition-property: color, background-color, border-color, background-image;
|
|
549
|
+
transition-duration: 0.15s;
|
|
550
|
+
transition-timing-function: ease-in-out;
|
|
551
|
+
}
|
|
552
|
+
.u-selectbox-select-icon-cross:hover {
|
|
553
|
+
background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11.3386 0.661444C11.7039 1.02675 11.7039 1.61903 11.3386 1.98433L1.98434 11.3386C1.61904 11.7039 1.02676 11.7039 0.661455 11.3386C0.29615 10.9733 0.296149 10.381 0.661454 10.0157L10.0157 0.661444C10.381 0.296138 10.9733 0.296138 11.3386 0.661444Z' fill='%231E4391'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.661432 0.661444C1.02674 0.296138 1.61901 0.296138 1.98432 0.661444L11.3385 10.0157C11.7039 10.381 11.7038 10.9733 11.3385 11.3386C10.9732 11.7039 10.381 11.7039 10.0157 11.3386L0.661432 1.98433C0.296127 1.61903 0.296127 1.02675 0.661432 0.661444Z' fill='%231E4391'/%3E%3C/svg%3E ");
|
|
554
|
+
}
|
|
555
|
+
.u-selectbox-select-title {
|
|
556
|
+
display: block;
|
|
557
|
+
max-width: calc(100% - 52px);
|
|
558
|
+
overflow: hidden;
|
|
559
|
+
white-space: nowrap;
|
|
560
|
+
text-overflow: ellipsis;
|
|
561
|
+
}
|
|
522
562
|
.u-selectbox-options {
|
|
523
563
|
display: none;
|
|
524
564
|
position: absolute;
|
|
@@ -531,6 +571,7 @@
|
|
|
531
571
|
cursor: pointer;
|
|
532
572
|
min-height: 48px;
|
|
533
573
|
height: 100%;
|
|
574
|
+
z-index: 100;
|
|
534
575
|
background-color: #FFFFFF;
|
|
535
576
|
border-bottom: 1px solid #CAD1E1;
|
|
536
577
|
padding: 14px 16px;
|
|
@@ -682,7 +723,7 @@
|
|
|
682
723
|
}
|
|
683
724
|
.u-checkbox div {
|
|
684
725
|
cursor: pointer;
|
|
685
|
-
width: 16px;
|
|
726
|
+
min-width: 16px;
|
|
686
727
|
height: 16px;
|
|
687
728
|
position: relative;
|
|
688
729
|
transition: all 0.15s ease-in-out;
|
|
@@ -696,15 +737,17 @@
|
|
|
696
737
|
padding: 0 18px;
|
|
697
738
|
font-size: 16px;
|
|
698
739
|
font-weight: 600;
|
|
699
|
-
transition:
|
|
740
|
+
transition-property: color, background-color, border-color, background-image;
|
|
741
|
+
transition-duration: 0.15s;
|
|
742
|
+
transition-timing-function: ease-in-out;
|
|
700
743
|
color: #A7A7A7;
|
|
701
|
-
background-color:
|
|
744
|
+
background-color: transparent;
|
|
702
745
|
border: 2px solid #D3D3D3;
|
|
703
746
|
}
|
|
704
747
|
.u-tab:focus,
|
|
705
748
|
.u-tab.u-tab-active {
|
|
706
749
|
color: #1E4391;
|
|
707
|
-
background-color:
|
|
750
|
+
background-color: transparent;
|
|
708
751
|
border: 2px solid #1E4391;
|
|
709
752
|
}
|
|
710
753
|
.u-tab:hover {
|
|
@@ -715,7 +758,7 @@
|
|
|
715
758
|
.u-tab-all-danger:focus,
|
|
716
759
|
.u-tab-all-danger.u-tab-active {
|
|
717
760
|
color: #EF302B;
|
|
718
|
-
background-color:
|
|
761
|
+
background-color: transparent;
|
|
719
762
|
border: 2px solid #EF302B;
|
|
720
763
|
}
|
|
721
764
|
.u-tab-all-danger:hover {
|
|
@@ -728,11 +771,13 @@
|
|
|
728
771
|
height: 54px;
|
|
729
772
|
padding: 0 16px;
|
|
730
773
|
border: none;
|
|
731
|
-
border-bottom: 2px solid
|
|
774
|
+
border-bottom: 2px solid transparent;
|
|
732
775
|
font-size: 16px;
|
|
733
776
|
font-weight: 400;
|
|
734
|
-
transition:
|
|
735
|
-
|
|
777
|
+
transition-property: color, background-color, border-color, background-image;
|
|
778
|
+
transition-duration: 0.15s;
|
|
779
|
+
transition-timing-function: ease-in-out;
|
|
780
|
+
background-color: transparent;
|
|
736
781
|
color: #545454;
|
|
737
782
|
}
|
|
738
783
|
.u-tab-line:hover,
|
|
@@ -746,11 +791,13 @@
|
|
|
746
791
|
height: 54px;
|
|
747
792
|
padding: 0 16px;
|
|
748
793
|
border: none;
|
|
749
|
-
border-bottom: 2px solid
|
|
794
|
+
border-bottom: 2px solid transparent;
|
|
750
795
|
font-size: 16px;
|
|
751
796
|
font-weight: 400;
|
|
752
|
-
transition:
|
|
753
|
-
|
|
797
|
+
transition-property: color, background-color, border-color, background-image;
|
|
798
|
+
transition-duration: 0.15s;
|
|
799
|
+
transition-timing-function: ease-in-out;
|
|
800
|
+
background-color: transparent;
|
|
754
801
|
color: #748AB9;
|
|
755
802
|
}
|
|
756
803
|
.u-tab-line-secondary:hover,
|
|
@@ -1044,7 +1091,7 @@ p {
|
|
|
1044
1091
|
.u-table table thead tr th {
|
|
1045
1092
|
color: #1E4391;
|
|
1046
1093
|
border-bottom: 2px solid #1E4391;
|
|
1047
|
-
padding:
|
|
1094
|
+
padding: 18px 20px;
|
|
1048
1095
|
width: 100%;
|
|
1049
1096
|
}
|
|
1050
1097
|
.u-table table thead tr th.sort div {
|
|
@@ -1082,6 +1129,9 @@ p {
|
|
|
1082
1129
|
background: linear-gradient(269.98deg, rgba(211, 211, 211, 0.8) -24.97%, rgba(211, 211, 211, 0) 112.48%);
|
|
1083
1130
|
transform: matrix(-1, 0, 0, 1, 0, 0);
|
|
1084
1131
|
}
|
|
1132
|
+
.u-table table thead tr th:first-child {
|
|
1133
|
+
padding-left: 50px;
|
|
1134
|
+
}
|
|
1085
1135
|
.u-table table tbody tr {
|
|
1086
1136
|
cursor: pointer;
|
|
1087
1137
|
background-color: white;
|
|
@@ -1089,7 +1139,7 @@ p {
|
|
|
1089
1139
|
.u-table table tbody tr td {
|
|
1090
1140
|
border-bottom: 1px solid #CAD1E1;
|
|
1091
1141
|
width: 200px;
|
|
1092
|
-
padding:
|
|
1142
|
+
padding: 20px;
|
|
1093
1143
|
}
|
|
1094
1144
|
.u-table table tbody tr td.sticky {
|
|
1095
1145
|
position: sticky;
|
|
@@ -1112,6 +1162,9 @@ p {
|
|
|
1112
1162
|
background: linear-gradient(269.98deg, rgba(211, 211, 211, 0.8) -24.97%, rgba(211, 211, 211, 0) 112.48%);
|
|
1113
1163
|
transform: matrix(-1, 0, 0, 1, 0, 0);
|
|
1114
1164
|
}
|
|
1165
|
+
.u-table table tbody tr td:first-child {
|
|
1166
|
+
padding-left: 50px;
|
|
1167
|
+
}
|
|
1115
1168
|
.u-table table tbody tr:last-child td {
|
|
1116
1169
|
border: none;
|
|
1117
1170
|
}
|
|
@@ -8,6 +8,7 @@
|
|
|
8
8
|
border: none;
|
|
9
9
|
font-weight: 500;
|
|
10
10
|
font-size: 13px;
|
|
11
|
+
white-space: nowrap;
|
|
11
12
|
cursor: pointer;
|
|
12
13
|
.transition;
|
|
13
14
|
}
|
|
@@ -20,6 +21,8 @@
|
|
|
20
21
|
font-weight: 600;
|
|
21
22
|
font-size: 14px;
|
|
22
23
|
background: none;
|
|
24
|
+
align-items: center;
|
|
25
|
+
white-space: nowrap;
|
|
23
26
|
cursor: pointer;
|
|
24
27
|
.transition;
|
|
25
28
|
}
|
|
@@ -134,7 +137,6 @@
|
|
|
134
137
|
}
|
|
135
138
|
.u-icon {
|
|
136
139
|
position: relative;
|
|
137
|
-
top: 3px;
|
|
138
140
|
margin-left: 8px;
|
|
139
141
|
&::before {
|
|
140
142
|
color: inherit;
|
|
@@ -8,6 +8,8 @@
|
|
|
8
8
|
font-size: 14px;
|
|
9
9
|
line-height: 20px;
|
|
10
10
|
color: @clr-main-dark;
|
|
11
|
+
background-color: @clr-secondary-empty;
|
|
12
|
+
width: 100%;
|
|
11
13
|
.transition;
|
|
12
14
|
}
|
|
13
15
|
|
|
@@ -76,12 +78,16 @@
|
|
|
76
78
|
&-required {
|
|
77
79
|
.input;
|
|
78
80
|
border: 1px solid @clr-main-danger;
|
|
79
|
-
&:hover,
|
|
81
|
+
&:hover, &.active {
|
|
80
82
|
border: 1px solid @clr-border-active;
|
|
81
83
|
}
|
|
82
84
|
&::placeholder {
|
|
83
85
|
color: @clr-secondary-subject;
|
|
84
86
|
}
|
|
87
|
+
&:focus {
|
|
88
|
+
outline: 0;
|
|
89
|
+
border: 1px solid @clr-border-active;
|
|
90
|
+
}
|
|
85
91
|
}
|
|
86
92
|
}
|
|
87
93
|
|
|
@@ -148,7 +154,7 @@
|
|
|
148
154
|
display: block;
|
|
149
155
|
}
|
|
150
156
|
}
|
|
151
|
-
&-icon {
|
|
157
|
+
&-icon-arrow {
|
|
152
158
|
position: absolute;
|
|
153
159
|
display: block;
|
|
154
160
|
background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.292892 4.29289C0.683416 3.90237 1.31658 3.90237 1.70711 4.29289L6.00001 8.58579L10.2929 4.29289C10.6834 3.90237 11.3166 3.90237 11.7071 4.29289C12.0976 4.68342 12.0976 5.31658 11.7071 5.70711L6.70712 10.7071C6.51958 10.8946 6.26523 11 6.00001 11C5.73479 11 5.48044 10.8946 5.2929 10.7071L0.292894 5.70711C-0.0976308 5.31658 -0.0976314 4.68342 0.292892 4.29289Z' fill='%231E4391'/%3E%3C/svg%3E ");
|
|
@@ -158,6 +164,27 @@
|
|
|
158
164
|
right: 20px;
|
|
159
165
|
top: calc(50% - 7px);
|
|
160
166
|
}
|
|
167
|
+
&-icon-cross {
|
|
168
|
+
position: absolute;
|
|
169
|
+
display: block;
|
|
170
|
+
background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11.3386 0.661444C11.7039 1.02675 11.7039 1.61903 11.3386 1.98433L1.98434 11.3386C1.61904 11.7039 1.02676 11.7039 0.661455 11.3386C0.29615 10.9733 0.296149 10.381 0.661454 10.0157L10.0157 0.661444C10.381 0.296138 10.9733 0.296138 11.3386 0.661444Z' fill='%23A7A7A7'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.661432 0.661444C1.02674 0.296138 1.61901 0.296138 1.98432 0.661444L11.3385 10.0157C11.7039 10.381 11.7038 10.9733 11.3385 11.3386C10.9732 11.7039 10.381 11.7039 10.0157 11.3386L0.661432 1.98433C0.296127 1.61903 0.296127 1.02675 0.661432 0.661444Z' fill='%23A7A7A7'/%3E%3C/svg%3E ");
|
|
171
|
+
background-repeat: no-repeat;
|
|
172
|
+
width: 12px;
|
|
173
|
+
height: 12px;
|
|
174
|
+
right: 44px;
|
|
175
|
+
top: calc(50% - 5px);
|
|
176
|
+
.transition;
|
|
177
|
+
&:hover {
|
|
178
|
+
background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11.3386 0.661444C11.7039 1.02675 11.7039 1.61903 11.3386 1.98433L1.98434 11.3386C1.61904 11.7039 1.02676 11.7039 0.661455 11.3386C0.29615 10.9733 0.296149 10.381 0.661454 10.0157L10.0157 0.661444C10.381 0.296138 10.9733 0.296138 11.3386 0.661444Z' fill='%231E4391'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.661432 0.661444C1.02674 0.296138 1.61901 0.296138 1.98432 0.661444L11.3385 10.0157C11.7039 10.381 11.7038 10.9733 11.3385 11.3386C10.9732 11.7039 10.381 11.7039 10.0157 11.3386L0.661432 1.98433C0.296127 1.61903 0.296127 1.02675 0.661432 0.661444Z' fill='%231E4391'/%3E%3C/svg%3E ");
|
|
179
|
+
}
|
|
180
|
+
}
|
|
181
|
+
&-title {
|
|
182
|
+
display: block;
|
|
183
|
+
max-width: calc(100% - 52px);
|
|
184
|
+
overflow: hidden;
|
|
185
|
+
white-space: nowrap;
|
|
186
|
+
text-overflow: ellipsis;
|
|
187
|
+
}
|
|
161
188
|
}
|
|
162
189
|
&-options {
|
|
163
190
|
display: none;
|
|
@@ -171,6 +198,7 @@
|
|
|
171
198
|
cursor: pointer;
|
|
172
199
|
min-height: 48px;
|
|
173
200
|
height: 100%;
|
|
201
|
+
z-index: 100;
|
|
174
202
|
background-color: @clr-secondary-empty;
|
|
175
203
|
border-bottom: 1px solid @clr-secondary-quiet;
|
|
176
204
|
padding: 14px 16px;
|
|
@@ -7,18 +7,7 @@
|
|
|
7
7
|
padding: 0 18px;
|
|
8
8
|
font-size: 16px;
|
|
9
9
|
font-weight: 600;
|
|
10
|
-
transition
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
.tab-secondary() {
|
|
14
|
-
cursor: pointer;
|
|
15
|
-
height: @height-secondary;
|
|
16
|
-
padding: 0 16px;
|
|
17
|
-
font-size: 16px;
|
|
18
|
-
font-weight: 400;
|
|
19
|
-
border: none;
|
|
20
|
-
border-radius: 10px;
|
|
21
|
-
transition: all .15s ease-out;
|
|
10
|
+
.transition;
|
|
22
11
|
}
|
|
23
12
|
|
|
24
13
|
.tab-line() {
|
|
@@ -26,21 +15,21 @@
|
|
|
26
15
|
height: @height-secondary;
|
|
27
16
|
padding: 0 16px;
|
|
28
17
|
border: none;
|
|
29
|
-
border-bottom: 2px solid
|
|
18
|
+
border-bottom: 2px solid transparent;
|
|
30
19
|
font-size: 16px;
|
|
31
20
|
font-weight: 400;
|
|
32
|
-
transition
|
|
33
|
-
background-color:
|
|
21
|
+
.transition;
|
|
22
|
+
background-color: transparent;
|
|
34
23
|
}
|
|
35
24
|
|
|
36
25
|
.u-tab {
|
|
37
26
|
.tab;
|
|
38
27
|
color: @clr-secondary-subject;
|
|
39
|
-
background-color:
|
|
28
|
+
background-color: transparent;
|
|
40
29
|
border: 2px solid @clr-secondary-outside;
|
|
41
30
|
&:focus, &.u-tab-active {
|
|
42
31
|
color: @clr-main-primary;
|
|
43
|
-
background-color:
|
|
32
|
+
background-color: transparent;
|
|
44
33
|
border: 2px solid @clr-main-primary;
|
|
45
34
|
}
|
|
46
35
|
&:hover {
|
|
@@ -51,7 +40,7 @@
|
|
|
51
40
|
&-all-danger {
|
|
52
41
|
&:focus, &.u-tab-active {
|
|
53
42
|
color: @clr-main-danger;
|
|
54
|
-
background-color:
|
|
43
|
+
background-color: transparent;
|
|
55
44
|
border: 2px solid @clr-main-danger;
|
|
56
45
|
}
|
|
57
46
|
&:hover {
|
|
@@ -28,7 +28,7 @@ p {
|
|
|
28
28
|
th {
|
|
29
29
|
color: @clr-main-primary;
|
|
30
30
|
border-bottom: 2px solid @clr-main-primary;
|
|
31
|
-
padding:
|
|
31
|
+
padding: 18px 20px;
|
|
32
32
|
width: 100%;
|
|
33
33
|
&.sort {
|
|
34
34
|
div {
|
|
@@ -69,6 +69,9 @@ p {
|
|
|
69
69
|
transform: matrix(-1, 0, 0, 1, 0, 0);
|
|
70
70
|
}
|
|
71
71
|
}
|
|
72
|
+
&:first-child {
|
|
73
|
+
padding-left: 50px;
|
|
74
|
+
}
|
|
72
75
|
}
|
|
73
76
|
}
|
|
74
77
|
}
|
|
@@ -79,7 +82,7 @@ p {
|
|
|
79
82
|
td {
|
|
80
83
|
border-bottom: 1px solid @clr-secondary-quiet;
|
|
81
84
|
width: 200px;
|
|
82
|
-
padding:
|
|
85
|
+
padding: 20px;
|
|
83
86
|
&.sticky {
|
|
84
87
|
position: sticky;
|
|
85
88
|
left: 0;
|
|
@@ -101,6 +104,9 @@ p {
|
|
|
101
104
|
transform: matrix(-1, 0, 0, 1, 0, 0);
|
|
102
105
|
}
|
|
103
106
|
}
|
|
107
|
+
&:first-child {
|
|
108
|
+
padding-left: 50px;
|
|
109
|
+
}
|
|
104
110
|
}
|
|
105
111
|
&:last-child {
|
|
106
112
|
td {
|