@megafon/ui-shared 2.0.0-beta.226 → 2.0.0-beta.227
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/CHANGELOG.md +14 -0
- package/dist/es/components/BenefitsIcons/style/BenefitsIcons.css +1 -1
- package/dist/es/components/BenefitsIcons/style/BenefitsIconsTile.css +2 -2
- package/dist/es/components/BenefitsPictures/BenfitsPictures.css +1 -1
- package/dist/es/components/Breadcrumbs/Breadcrumbs.css +1 -1
- package/dist/es/components/ButtonBanner/ButtonBanner.css +6 -6
- package/dist/es/components/Card/Card.css +13 -13
- package/dist/es/components/Container/Container.css +16 -16
- package/dist/es/components/Instructions/Instructions.css +26 -26
- package/dist/es/components/PageTitle/PageTitle.css +1 -1
- package/dist/es/components/Partners/Partners.css +2 -2
- package/dist/es/components/PictureWithDescription/PictureWithDescription.css +2 -2
- package/dist/es/components/Property/Property.css +11 -11
- package/dist/es/components/Property/PropertyDescription.css +1 -1
- package/dist/es/components/Steps/Steps.css +2 -2
- package/dist/es/components/Steps/StepsItem.css +3 -3
- package/dist/es/components/StoreBanner/StoreBanner.css +9 -9
- package/dist/es/components/StoreButton/StoreButton.css +2 -2
- package/dist/es/components/Table/Table.css +48 -48
- package/dist/es/components/TextBox/TextBoxPicture.css +3 -3
- package/dist/es/components/TextBox/TextBoxPicture.d.ts +3 -3
- package/dist/es/components/TextBox/TextBoxPicture.js +4 -4
- package/dist/es/components/VideoBanner/VideoBanner.css +8 -8
- package/dist/es/components/VideoBlock/VideoBlock.css +3 -3
- package/dist/lib/components/BenefitsIcons/style/BenefitsIcons.css +1 -1
- package/dist/lib/components/BenefitsIcons/style/BenefitsIconsTile.css +2 -2
- package/dist/lib/components/BenefitsPictures/BenfitsPictures.css +1 -1
- package/dist/lib/components/Breadcrumbs/Breadcrumbs.css +1 -1
- package/dist/lib/components/ButtonBanner/ButtonBanner.css +6 -6
- package/dist/lib/components/Card/Card.css +13 -13
- package/dist/lib/components/Container/Container.css +16 -16
- package/dist/lib/components/Instructions/Instructions.css +26 -26
- package/dist/lib/components/PageTitle/PageTitle.css +1 -1
- package/dist/lib/components/Partners/Partners.css +2 -2
- package/dist/lib/components/PictureWithDescription/PictureWithDescription.css +2 -2
- package/dist/lib/components/Property/Property.css +11 -11
- package/dist/lib/components/Property/PropertyDescription.css +1 -1
- package/dist/lib/components/Steps/Steps.css +2 -2
- package/dist/lib/components/Steps/StepsItem.css +3 -3
- package/dist/lib/components/StoreBanner/StoreBanner.css +9 -9
- package/dist/lib/components/StoreButton/StoreButton.css +2 -2
- package/dist/lib/components/Table/Table.css +48 -48
- package/dist/lib/components/TextBox/TextBoxPicture.css +3 -3
- package/dist/lib/components/TextBox/TextBoxPicture.d.ts +3 -3
- package/dist/lib/components/TextBox/TextBoxPicture.js +4 -4
- package/dist/lib/components/VideoBanner/VideoBanner.css +8 -8
- package/dist/lib/components/VideoBlock/VideoBlock.css +3 -3
- package/package.json +4 -4
@@ -6,8 +6,8 @@ h5 {
|
|
6
6
|
margin: 0;
|
7
7
|
}
|
8
8
|
.mfui-beta-instructions__title_resolution_mobile {
|
9
|
-
text-align: center;
|
10
9
|
margin-bottom: 32px;
|
10
|
+
text-align: center;
|
11
11
|
}
|
12
12
|
@media screen and (min-width: 768px) and (max-width: 1023px) {
|
13
13
|
.mfui-beta-instructions__title_resolution_mobile {
|
@@ -67,10 +67,10 @@ h5 {
|
|
67
67
|
}
|
68
68
|
@media screen and (min-width: 1024px) {
|
69
69
|
.mfui-beta-instructions__picture {
|
70
|
-
width: 50%;
|
71
70
|
-webkit-box-ordinal-group: 3;
|
72
71
|
-ms-flex-order: 2;
|
73
72
|
order: 2;
|
73
|
+
width: 50%;
|
74
74
|
}
|
75
75
|
}
|
76
76
|
@media screen and (min-width: 1024px) {
|
@@ -103,15 +103,15 @@ h5 {
|
|
103
103
|
.mfui-beta-instructions__img-wrapper:before {
|
104
104
|
content: '';
|
105
105
|
position: absolute;
|
106
|
-
|
106
|
+
right: 0;
|
107
107
|
bottom: 0;
|
108
108
|
left: 0;
|
109
|
-
|
109
|
+
z-index: 2;
|
110
|
+
display: block;
|
110
111
|
width: 324px;
|
111
112
|
height: 1px;
|
112
113
|
margin: 0 auto;
|
113
114
|
background: #D8D8D8;
|
114
|
-
z-index: 2;
|
115
115
|
}
|
116
116
|
}
|
117
117
|
.mfui-beta-instructions__device-screen {
|
@@ -136,8 +136,8 @@ h5 {
|
|
136
136
|
.mfui-beta-instructions_mask_android .mfui-beta-instructions__swiper {
|
137
137
|
position: absolute;
|
138
138
|
top: 59px;
|
139
|
-
left: 0;
|
140
139
|
right: 0;
|
140
|
+
left: 0;
|
141
141
|
width: 204px;
|
142
142
|
height: 363px;
|
143
143
|
margin: auto;
|
@@ -171,24 +171,24 @@ h5 {
|
|
171
171
|
}
|
172
172
|
.mfui-beta-instructions_mask_new-iphone .mfui-beta-instructions__device-screen {
|
173
173
|
position: relative;
|
174
|
+
z-index: 2;
|
174
175
|
width: 100%;
|
175
176
|
height: 490px;
|
176
177
|
margin: auto;
|
177
178
|
background: url('./img/newIphone.png') 50% no-repeat;
|
178
179
|
background-size: contain;
|
179
|
-
z-index: 2;
|
180
180
|
}
|
181
181
|
.mfui-beta-instructions_mask_new-iphone .mfui-beta-instructions__swiper {
|
182
182
|
position: absolute;
|
183
183
|
top: 14px;
|
184
|
-
left: 0;
|
185
184
|
right: 0;
|
185
|
+
left: 0;
|
186
|
+
z-index: 1;
|
186
187
|
width: 214px;
|
187
188
|
height: 462px;
|
188
189
|
margin: auto;
|
189
|
-
overflow: hidden;
|
190
190
|
border-radius: 20px;
|
191
|
-
|
191
|
+
overflow: hidden;
|
192
192
|
}
|
193
193
|
@media screen and (max-width: 1023px) {
|
194
194
|
.mfui-beta-instructions_mask_iphone-12 .mfui-beta-instructions__img-wrapper:before {
|
@@ -197,24 +197,24 @@ h5 {
|
|
197
197
|
}
|
198
198
|
.mfui-beta-instructions_mask_iphone-12 .mfui-beta-instructions__device-screen {
|
199
199
|
position: relative;
|
200
|
+
z-index: 2;
|
200
201
|
width: 100%;
|
201
202
|
height: 490px;
|
202
203
|
margin: auto;
|
203
204
|
background: url('./img/iphone12.png') 50% no-repeat;
|
204
205
|
background-size: contain;
|
205
|
-
z-index: 2;
|
206
206
|
}
|
207
207
|
.mfui-beta-instructions_mask_iphone-12 .mfui-beta-instructions__swiper {
|
208
208
|
position: absolute;
|
209
209
|
top: 14px;
|
210
|
-
left: 0;
|
211
210
|
right: 0;
|
211
|
+
left: 0;
|
212
|
+
z-index: 1;
|
212
213
|
width: 214px;
|
213
214
|
height: 462px;
|
214
215
|
margin: auto;
|
215
|
-
overflow: hidden;
|
216
216
|
border-radius: 20px;
|
217
|
-
|
217
|
+
overflow: hidden;
|
218
218
|
}
|
219
219
|
@media screen and (min-width: 768px) and (max-width: 1023px) {
|
220
220
|
.mfui-beta-instructions_mask_laptop .mfui-beta-instructions__img-wrapper {
|
@@ -278,8 +278,8 @@ h5 {
|
|
278
278
|
.mfui-beta-instructions_mask_laptop .mfui-beta-instructions__swiper {
|
279
279
|
position: absolute;
|
280
280
|
top: 50%;
|
281
|
-
left: 50%;
|
282
281
|
right: 0;
|
282
|
+
left: 50%;
|
283
283
|
width: 78%;
|
284
284
|
margin: auto;
|
285
285
|
overflow: hidden;
|
@@ -311,10 +311,10 @@ h5 {
|
|
311
311
|
}
|
312
312
|
@media screen and (min-width: 1024px) {
|
313
313
|
.mfui-beta-instructions__articles {
|
314
|
-
width: 50%;
|
315
314
|
-webkit-box-ordinal-group: 2;
|
316
315
|
-ms-flex-order: 1;
|
317
316
|
order: 1;
|
317
|
+
width: 50%;
|
318
318
|
}
|
319
319
|
}
|
320
320
|
@media screen and (min-width: 1024px) {
|
@@ -323,9 +323,9 @@ h5 {
|
|
323
323
|
}
|
324
324
|
}
|
325
325
|
.mfui-beta-instructions__articles-list {
|
326
|
-
list-style-type: none;
|
327
|
-
padding: 0;
|
328
326
|
margin: 0;
|
327
|
+
padding: 0;
|
328
|
+
list-style-type: none;
|
329
329
|
}
|
330
330
|
.mfui-beta-instructions__articles-list_text-after {
|
331
331
|
margin-bottom: 48px;
|
@@ -341,8 +341,8 @@ h5 {
|
|
341
341
|
}
|
342
342
|
}
|
343
343
|
.mfui-beta-instructions__articles-item {
|
344
|
-
opacity: 0.5;
|
345
344
|
position: relative;
|
345
|
+
opacity: 0.5;
|
346
346
|
}
|
347
347
|
@media screen and (min-width: 1024px) {
|
348
348
|
.mfui-beta-instructions__articles-item {
|
@@ -360,9 +360,9 @@ h5 {
|
|
360
360
|
.mfui-beta-instructions__articles-item:hover .mfui-beta-instructions__articles-item-dot:before,
|
361
361
|
.mfui-beta-instructions__articles-item_active .mfui-beta-instructions__articles-item-dot:before {
|
362
362
|
top: 0;
|
363
|
-
left: 0;
|
364
363
|
right: 0;
|
365
364
|
bottom: 0;
|
365
|
+
left: 0;
|
366
366
|
background: #00B956;
|
367
367
|
}
|
368
368
|
@media screen and (min-width: 1024px) {
|
@@ -376,11 +376,11 @@ h5 {
|
|
376
376
|
display: inline-block;
|
377
377
|
width: 40px;
|
378
378
|
height: 40px;
|
379
|
+
border-radius: 50%;
|
380
|
+
font-weight: 500;
|
379
381
|
font-size: 15px;
|
380
382
|
line-height: 40px;
|
381
|
-
font-weight: 500;
|
382
383
|
text-align: center;
|
383
|
-
border-radius: 50%;
|
384
384
|
-webkit-box-shadow: inset 0 0 0 1px #B2B2B2;
|
385
385
|
box-shadow: inset 0 0 0 1px #B2B2B2;
|
386
386
|
cursor: pointer;
|
@@ -396,12 +396,12 @@ h5 {
|
|
396
396
|
content: '';
|
397
397
|
position: absolute;
|
398
398
|
top: 50%;
|
399
|
-
left: 50%;
|
400
399
|
right: 50%;
|
401
400
|
bottom: 50%;
|
401
|
+
left: 50%;
|
402
|
+
border-radius: 50%;
|
402
403
|
-webkit-transition: all 0.3s ease;
|
403
404
|
transition: all 0.3s ease;
|
404
|
-
border-radius: 50%;
|
405
405
|
}
|
406
406
|
.mfui-beta-instructions__articles-item-dot-number,
|
407
407
|
.mfui-beta-instructions__articles-dot-number {
|
@@ -427,8 +427,8 @@ h5 {
|
|
427
427
|
-webkit-box-pack: center;
|
428
428
|
-ms-flex-pack: center;
|
429
429
|
justify-content: center;
|
430
|
-
padding: 0;
|
431
430
|
margin: 0;
|
431
|
+
padding: 0;
|
432
432
|
list-style-type: none;
|
433
433
|
}
|
434
434
|
.mfui-beta-instructions__articles-dots_text-after {
|
@@ -454,9 +454,9 @@ h5 {
|
|
454
454
|
.mfui-beta-instructions__articles-dot:hover:before,
|
455
455
|
.mfui-beta-instructions__articles-dot_active:before {
|
456
456
|
top: 0;
|
457
|
-
left: 0;
|
458
457
|
right: 0;
|
459
458
|
bottom: 0;
|
459
|
+
left: 0;
|
460
460
|
background: #00B956;
|
461
461
|
}
|
462
462
|
.mfui-beta-instructions__articles-dot:last-child {
|
@@ -41,9 +41,9 @@ h5 {
|
|
41
41
|
display: inline-block;
|
42
42
|
margin-top: 16px;
|
43
43
|
padding: 2px 14px;
|
44
|
+
color: #FFFFFF;
|
44
45
|
font-weight: 500;
|
45
46
|
background-color: #731982;
|
46
|
-
color: #FFFFFF;
|
47
47
|
}
|
48
48
|
@media screen and (min-width: 1280px) {
|
49
49
|
.mfui-beta-page-title__badge_under-breadcrumbs {
|
@@ -34,10 +34,10 @@ h5 {
|
|
34
34
|
}
|
35
35
|
@media screen and (min-width: 1024px) {
|
36
36
|
.mfui-beta-picture-with-description__picture {
|
37
|
-
width: 50%;
|
38
37
|
-webkit-box-ordinal-group: 3;
|
39
38
|
-ms-flex-order: 2;
|
40
39
|
order: 2;
|
40
|
+
width: 50%;
|
41
41
|
}
|
42
42
|
}
|
43
43
|
@media screen and (min-width: 1024px) {
|
@@ -61,10 +61,10 @@ h5 {
|
|
61
61
|
}
|
62
62
|
@media screen and (min-width: 1024px) {
|
63
63
|
.mfui-beta-picture-with-description__articles {
|
64
|
-
width: 50%;
|
65
64
|
-webkit-box-ordinal-group: 2;
|
66
65
|
-ms-flex-order: 1;
|
67
66
|
order: 1;
|
67
|
+
width: 50%;
|
68
68
|
}
|
69
69
|
}
|
70
70
|
@media screen and (min-width: 1024px) {
|
@@ -35,19 +35,19 @@ h5 {
|
|
35
35
|
display: flex;
|
36
36
|
}
|
37
37
|
.mfui-beta-property__icon {
|
38
|
+
display: inline-block;
|
38
39
|
width: 24px;
|
39
40
|
height: 24px;
|
40
|
-
overflow: hidden;
|
41
41
|
margin-right: 9px;
|
42
42
|
margin-left: 1px;
|
43
|
-
|
43
|
+
overflow: hidden;
|
44
44
|
vertical-align: bottom;
|
45
45
|
}
|
46
46
|
.mfui-beta-property__badge {
|
47
|
-
border-radius: 2px;
|
48
|
-
font-size: 12px;
|
49
47
|
padding: 2px 8px;
|
48
|
+
border-radius: 2px;
|
50
49
|
color: #FFFFFF;
|
50
|
+
font-size: 12px;
|
51
51
|
background: #FFA717;
|
52
52
|
}
|
53
53
|
.mfui-beta-property__inner {
|
@@ -70,18 +70,18 @@ h5 {
|
|
70
70
|
width: 100%;
|
71
71
|
}
|
72
72
|
.mfui-beta-property__value-wrapper {
|
73
|
-
width: 35%;
|
74
73
|
display: -webkit-box;
|
75
74
|
display: -ms-flexbox;
|
76
75
|
display: flex;
|
77
|
-
-
|
78
|
-
|
79
|
-
justify-content: flex-end;
|
76
|
+
-ms-flex-negative: 0;
|
77
|
+
flex-shrink: 0;
|
80
78
|
-webkit-box-align: start;
|
81
79
|
-ms-flex-align: start;
|
82
80
|
align-items: flex-start;
|
83
|
-
-
|
84
|
-
flex-
|
81
|
+
-webkit-box-pack: end;
|
82
|
+
-ms-flex-pack: end;
|
83
|
+
justify-content: flex-end;
|
84
|
+
width: 35%;
|
85
85
|
}
|
86
86
|
@media screen and (max-width: 479px) {
|
87
87
|
.mfui-beta-property__value-wrapper {
|
@@ -90,10 +90,10 @@ h5 {
|
|
90
90
|
}
|
91
91
|
}
|
92
92
|
.mfui-beta-property__value-wrapper_merged {
|
93
|
-
border-left: 1px solid #D8D8D8;
|
94
93
|
-webkit-box-align: center;
|
95
94
|
-ms-flex-align: center;
|
96
95
|
align-items: center;
|
96
|
+
border-left: 1px solid #D8D8D8;
|
97
97
|
}
|
98
98
|
.mfui-beta-property__desc {
|
99
99
|
margin-top: 8px;
|
@@ -7,8 +7,8 @@ h5 {
|
|
7
7
|
}
|
8
8
|
.mfui-beta-steps {
|
9
9
|
width: 66%;
|
10
|
-
margin-left: auto;
|
11
10
|
margin-right: auto;
|
11
|
+
margin-left: auto;
|
12
12
|
}
|
13
13
|
@media screen and (min-width: 1280px) {
|
14
14
|
.mfui-beta-steps {
|
@@ -24,9 +24,9 @@ h5 {
|
|
24
24
|
margin-bottom: 40px;
|
25
25
|
}
|
26
26
|
.mfui-beta-steps__list {
|
27
|
-
list-style: none;
|
28
27
|
margin: 0;
|
29
28
|
padding: 0;
|
29
|
+
list-style: none;
|
30
30
|
}
|
31
31
|
.mfui-beta-steps__item {
|
32
32
|
margin-bottom: 48px;
|
@@ -17,19 +17,19 @@ h5 {
|
|
17
17
|
display: -webkit-box;
|
18
18
|
display: -ms-flexbox;
|
19
19
|
display: flex;
|
20
|
+
-ms-flex-negative: 0;
|
21
|
+
flex-shrink: 0;
|
20
22
|
-webkit-box-align: center;
|
21
23
|
-ms-flex-align: center;
|
22
24
|
align-items: center;
|
23
25
|
-webkit-box-pack: center;
|
24
26
|
-ms-flex-pack: center;
|
25
27
|
justify-content: center;
|
26
|
-
-ms-flex-negative: 0;
|
27
|
-
flex-shrink: 0;
|
28
28
|
width: 40px;
|
29
29
|
height: 40px;
|
30
30
|
border-radius: 50%;
|
31
|
-
background-color: #00B956;
|
32
31
|
color: #FFFFFF;
|
32
|
+
background-color: #00B956;
|
33
33
|
}
|
34
34
|
.mfui-beta-steps-item__text-wrapper {
|
35
35
|
padding-top: 8px;
|
@@ -29,8 +29,8 @@ h5 {
|
|
29
29
|
background-image: url('./img/new-iphone.png');
|
30
30
|
}
|
31
31
|
.mfui-beta-store-banner_mask_new-iphone .mfui-beta-store-banner__screen {
|
32
|
-
z-index: 1;
|
33
32
|
top: 13px;
|
33
|
+
z-index: 1;
|
34
34
|
width: 87%;
|
35
35
|
}
|
36
36
|
@media screen and (min-width: 768px) and (max-width: 1023px) {
|
@@ -110,9 +110,9 @@ h5 {
|
|
110
110
|
}
|
111
111
|
@media screen and (max-width: 767px) {
|
112
112
|
.mfui-beta-store-banner__content {
|
113
|
+
padding-right: 15px;
|
113
114
|
padding-bottom: 32px;
|
114
115
|
padding-left: 15px;
|
115
|
-
padding-right: 15px;
|
116
116
|
text-align: center;
|
117
117
|
}
|
118
118
|
}
|
@@ -122,12 +122,12 @@ h5 {
|
|
122
122
|
background-size: cover;
|
123
123
|
}
|
124
124
|
.mfui-beta-store-banner__device-wrapper {
|
125
|
-
width: 235px;
|
126
125
|
position: relative;
|
127
126
|
bottom: calc(2 * (32px - 1px));
|
127
|
+
width: 235px;
|
128
128
|
height: calc(100% + 2 * 32px + 30px);
|
129
|
-
margin-left: auto;
|
130
129
|
margin-right: auto;
|
130
|
+
margin-left: auto;
|
131
131
|
overflow: hidden;
|
132
132
|
}
|
133
133
|
@media screen and (min-width: 1024px) and (max-width: 1279px) {
|
@@ -192,12 +192,12 @@ h5 {
|
|
192
192
|
margin-bottom: 10px;
|
193
193
|
}
|
194
194
|
.mfui-beta-store-banner__stores {
|
195
|
-
-webkit-box-flex: 1;
|
196
|
-
-ms-flex-positive: 1;
|
197
|
-
flex-grow: 1;
|
198
195
|
display: -webkit-box;
|
199
196
|
display: -ms-flexbox;
|
200
197
|
display: flex;
|
198
|
+
-webkit-box-flex: 1;
|
199
|
+
-ms-flex-positive: 1;
|
200
|
+
flex-grow: 1;
|
201
201
|
-ms-flex-wrap: wrap;
|
202
202
|
flex-wrap: wrap;
|
203
203
|
}
|
@@ -242,10 +242,10 @@ h5 {
|
|
242
242
|
-webkit-box-direction: normal;
|
243
243
|
-ms-flex-direction: row;
|
244
244
|
flex-direction: row;
|
245
|
-
max-width: 305px;
|
246
245
|
-webkit-box-pack: start;
|
247
246
|
-ms-flex-pack: start;
|
248
247
|
justify-content: flex-start;
|
248
|
+
max-width: 305px;
|
249
249
|
}
|
250
250
|
}
|
251
251
|
.mfui-beta-store-banner__links_three .mfui-beta-store-banner__qr-code + .mfui-beta-store-banner__stores .mfui-beta-store-banner__store-link {
|
@@ -255,8 +255,8 @@ h5 {
|
|
255
255
|
margin-right: 0;
|
256
256
|
}
|
257
257
|
.mfui-beta-store-banner__links_three .mfui-beta-store-banner__store-link {
|
258
|
-
height: 35px;
|
259
258
|
width: 119px;
|
259
|
+
height: 35px;
|
260
260
|
}
|
261
261
|
@media screen and (max-width: 1023px) {
|
262
262
|
.mfui-beta-store-banner__links_three .mfui-beta-store-banner__store-link:not(:first-child) {
|
@@ -1,8 +1,8 @@
|
|
1
1
|
.mfui-beta-store-button {
|
2
|
-
|
2
|
+
border-radius: 8px;
|
3
3
|
background-repeat: no-repeat;
|
4
4
|
background-position: center;
|
5
|
-
|
5
|
+
background-size: cover;
|
6
6
|
}
|
7
7
|
.mfui-beta-store-button_theme_app-store {
|
8
8
|
background-image: url('./img/app-store.png');
|
@@ -6,20 +6,38 @@ h5 {
|
|
6
6
|
margin: 0;
|
7
7
|
}
|
8
8
|
.mfui-beta-table {
|
9
|
-
font-family: inherit;
|
10
|
-
font-size: 15px;
|
11
|
-
line-height: 24px;
|
12
9
|
display: -webkit-box;
|
13
10
|
display: -ms-flexbox;
|
14
11
|
display: flex;
|
12
|
+
font-family: inherit;
|
13
|
+
font-size: 15px;
|
14
|
+
line-height: 24px;
|
15
|
+
}
|
16
|
+
.mfui-beta-table:not(.mfui-beta-table_touch) ::-webkit-scrollbar {
|
17
|
+
width: 8px;
|
18
|
+
height: 8px;
|
19
|
+
}
|
20
|
+
.mfui-beta-table:not(.mfui-beta-table_touch) ::-webkit-scrollbar-track {
|
21
|
+
background-color: #EDEDED;
|
22
|
+
}
|
23
|
+
.mfui-beta-table:not(.mfui-beta-table_touch) ::-webkit-scrollbar-thumb {
|
24
|
+
border-radius: 4px;
|
25
|
+
background-color: #D8D8D8;
|
26
|
+
}
|
27
|
+
.mfui-beta-table:not(.mfui-beta-table_touch) ::-webkit-scrollbar-corner {
|
28
|
+
background-color: #FFFFFF;
|
29
|
+
}
|
30
|
+
.mfui-beta-table:not(.mfui-beta-table_touch) .mfui-beta-table__scroll {
|
31
|
+
scrollbar-color: #D8D8D8 #EDEDED;
|
32
|
+
scrollbar-width: thin;
|
15
33
|
}
|
16
34
|
.mfui-beta-table__scroll {
|
35
|
+
position: relative;
|
17
36
|
display: grid;
|
18
37
|
grid-template-columns: auto auto auto;
|
19
38
|
max-width: 100%;
|
20
|
-
overflow: auto;
|
21
|
-
position: relative;
|
22
39
|
border: 1px solid #D8D8D8;
|
40
|
+
overflow: auto;
|
23
41
|
}
|
24
42
|
@media screen and (min-width: 1024px) {
|
25
43
|
.mfui-beta-table__scroll {
|
@@ -30,76 +48,76 @@ h5 {
|
|
30
48
|
position: -webkit-sticky;
|
31
49
|
position: sticky;
|
32
50
|
top: 0;
|
33
|
-
|
51
|
+
z-index: 2;
|
34
52
|
display: block;
|
35
|
-
grid-column-end: 4;
|
36
53
|
grid-column-start: 1;
|
37
|
-
|
38
|
-
|
54
|
+
grid-column-end: 4;
|
55
|
+
width: 100%;
|
39
56
|
height: 6px;
|
57
|
+
margin-bottom: -6px;
|
40
58
|
background: linear-gradient(359.94deg, rgba(0, 0, 0, 0.0001) 0.06%, rgba(0, 0, 0, 0.03) 38.08%, rgba(0, 0, 0, 0.08) 74.98%);
|
41
59
|
}
|
42
60
|
.mfui-beta-table__left-shadow {
|
43
61
|
position: -webkit-sticky;
|
44
62
|
position: sticky;
|
45
|
-
z-index: 2;
|
46
|
-
width: 6px;
|
47
|
-
left: 0;
|
48
63
|
top: 0;
|
49
64
|
bottom: 0;
|
65
|
+
left: 0;
|
66
|
+
z-index: 2;
|
67
|
+
width: 6px;
|
50
68
|
margin-right: -6px;
|
51
69
|
background: -webkit-gradient(linear, right top, left top, color-stop(16.3%, rgba(0, 0, 0, 0.0001)), color-stop(51.81%, rgba(0, 0, 0, 0.03)), color-stop(86.27%, rgba(0, 0, 0, 0.08)));
|
52
70
|
background: linear-gradient(270deg, rgba(0, 0, 0, 0.0001) 16.3%, rgba(0, 0, 0, 0.03) 51.81%, rgba(0, 0, 0, 0.08) 86.27%);
|
53
71
|
}
|
54
72
|
.mfui-beta-table__bottom-gradient {
|
55
|
-
display: block;
|
56
|
-
height: 48px;
|
57
|
-
width: 100%;
|
58
|
-
margin-top: -48px;
|
59
73
|
position: -webkit-sticky;
|
60
74
|
position: sticky;
|
61
|
-
z-index: 1;
|
62
75
|
bottom: 0;
|
76
|
+
z-index: 1;
|
77
|
+
display: block;
|
78
|
+
grid-column-start: 1;
|
79
|
+
grid-column-end: 4;
|
80
|
+
width: 100%;
|
81
|
+
height: 48px;
|
82
|
+
margin-top: -48px;
|
63
83
|
background: -webkit-gradient(linear, left bottom, left top, color-stop(25%, #FFFFFF), to(rgba(255, 255, 255, 0)));
|
64
84
|
background: linear-gradient(to top, #FFFFFF 25%, rgba(255, 255, 255, 0));
|
65
|
-
grid-column-end: 4;
|
66
|
-
grid-column-start: 1;
|
67
85
|
}
|
68
86
|
.mfui-beta-table__right-gradient {
|
69
|
-
display: block;
|
70
|
-
height: 100%;
|
71
|
-
width: 48px;
|
72
87
|
position: -webkit-sticky;
|
73
88
|
position: sticky;
|
74
|
-
z-index: 1;
|
75
89
|
right: 0;
|
90
|
+
z-index: 1;
|
91
|
+
display: block;
|
92
|
+
width: 48px;
|
93
|
+
height: 100%;
|
76
94
|
margin-left: -48px;
|
77
95
|
background: -webkit-gradient(linear, right top, left top, color-stop(25%, #FFFFFF), to(rgba(255, 255, 255, 0)));
|
78
96
|
background: linear-gradient(to left, #FFFFFF 25%, rgba(255, 255, 255, 0));
|
79
97
|
}
|
80
98
|
.mfui-beta-table__table {
|
81
|
-
border-spacing: 0;
|
82
99
|
border-width: 0;
|
83
100
|
border-collapse: separate;
|
101
|
+
border-spacing: 0;
|
84
102
|
background-color: #FFFFFF;
|
85
103
|
}
|
86
104
|
.mfui-beta-table__cell {
|
87
|
-
padding: 24px;
|
88
105
|
-webkit-box-sizing: border-box;
|
89
106
|
box-sizing: border-box;
|
107
|
+
padding: 24px;
|
90
108
|
background-color: #FFFFFF;
|
91
109
|
}
|
92
110
|
@media screen and (max-width: 767px) {
|
93
111
|
.mfui-beta-table__cell {
|
94
|
-
padding-left: 16px;
|
95
112
|
padding-right: 16px;
|
113
|
+
padding-left: 16px;
|
96
114
|
}
|
97
115
|
}
|
98
116
|
.mfui-beta-table__cell:first-child {
|
117
|
+
position: relative;
|
99
118
|
left: 0;
|
100
|
-
min-width: 144px;
|
101
119
|
width: 144px;
|
102
|
-
|
120
|
+
min-width: 144px;
|
103
121
|
border-right: 1px solid #D8D8D8;
|
104
122
|
}
|
105
123
|
.mfui-beta-table__cell:not(:first-child) {
|
@@ -109,10 +127,10 @@ h5 {
|
|
109
127
|
font-size: 12px;
|
110
128
|
line-height: 16px;
|
111
129
|
height: 72px;
|
112
|
-
background-color: #F6F6F6;
|
113
|
-
color: rgba(51, 51, 51, 0.5);
|
114
130
|
padding-bottom: 12px;
|
131
|
+
color: rgba(51, 51, 51, 0.5);
|
115
132
|
vertical-align: bottom;
|
133
|
+
background-color: #F6F6F6;
|
116
134
|
}
|
117
135
|
.mfui-beta-table__row:not(:last-child) .mfui-beta-table__cell {
|
118
136
|
border-bottom: 1px solid #D8D8D8;
|
@@ -133,21 +151,3 @@ h5 {
|
|
133
151
|
.mfui-beta-table_fix-column .mfui-beta-table__bottom-gradient {
|
134
152
|
z-index: 3;
|
135
153
|
}
|
136
|
-
.mfui-beta-table:not(.mfui-beta-table_touch) ::-webkit-scrollbar {
|
137
|
-
width: 8px;
|
138
|
-
height: 8px;
|
139
|
-
}
|
140
|
-
.mfui-beta-table:not(.mfui-beta-table_touch) ::-webkit-scrollbar-track {
|
141
|
-
background-color: #EDEDED;
|
142
|
-
}
|
143
|
-
.mfui-beta-table:not(.mfui-beta-table_touch) ::-webkit-scrollbar-thumb {
|
144
|
-
border-radius: 4px;
|
145
|
-
background-color: #D8D8D8;
|
146
|
-
}
|
147
|
-
.mfui-beta-table:not(.mfui-beta-table_touch) ::-webkit-scrollbar-corner {
|
148
|
-
background-color: #FFFFFF;
|
149
|
-
}
|
150
|
-
.mfui-beta-table:not(.mfui-beta-table_touch) .mfui-beta-table__scroll {
|
151
|
-
scrollbar-color: #D8D8D8 #EDEDED;
|
152
|
-
scrollbar-width: thin;
|
153
|
-
}
|
@@ -8,13 +8,13 @@ h5 {
|
|
8
8
|
.mfui-beta-text-box-picture_margin_default {
|
9
9
|
margin: 16px 0;
|
10
10
|
}
|
11
|
-
.mfui-beta-text-box-
|
11
|
+
.mfui-beta-text-box-picture_margin_big-top {
|
12
12
|
margin: 24px 0 16px;
|
13
13
|
}
|
14
|
-
.mfui-beta-text-box-
|
14
|
+
.mfui-beta-text-box-picture_margin_big-bottom {
|
15
15
|
margin: 16px 0 24px;
|
16
16
|
}
|
17
|
-
.mfui-beta-text-box-
|
17
|
+
.mfui-beta-text-box-picture_margin_big-vertical {
|
18
18
|
margin: 24px 0;
|
19
19
|
}
|
20
20
|
.mfui-beta-text-box-picture__img {
|
@@ -2,9 +2,9 @@ import * as React from 'react';
|
|
2
2
|
import './TextBoxPicture.less';
|
3
3
|
export declare const pictureMarginTypes: {
|
4
4
|
readonly DEFAULT: "default";
|
5
|
-
readonly
|
6
|
-
readonly
|
7
|
-
readonly
|
5
|
+
readonly BIG_TOP: "big-top";
|
6
|
+
readonly BIG_BOTTOM: "big-bottom";
|
7
|
+
readonly BIG_VERTICAL: "big-vertical";
|
8
8
|
};
|
9
9
|
declare type PictureMarginTypesType = typeof pictureMarginTypes[keyof typeof pictureMarginTypes];
|
10
10
|
export interface ITextBoxPictureProps {
|
@@ -19,9 +19,9 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
|
|
19
19
|
|
20
20
|
var pictureMarginTypes = {
|
21
21
|
DEFAULT: 'default',
|
22
|
-
|
23
|
-
|
24
|
-
|
22
|
+
BIG_TOP: 'big-top',
|
23
|
+
BIG_BOTTOM: 'big-bottom',
|
24
|
+
BIG_VERTICAL: 'big-vertical'
|
25
25
|
};
|
26
26
|
exports.pictureMarginTypes = pictureMarginTypes;
|
27
27
|
var cn = (0, _uiHelpers.cnCreate)('mfui-beta-text-box-picture');
|
@@ -42,7 +42,7 @@ var TextBoxPicture = function TextBoxPicture(_ref) {
|
|
42
42
|
|
43
43
|
TextBoxPicture.propTypes = {
|
44
44
|
url: PropTypes.string.isRequired,
|
45
|
-
margin: PropTypes.oneOf([pictureMarginTypes.DEFAULT, pictureMarginTypes.
|
45
|
+
margin: PropTypes.oneOf([pictureMarginTypes.DEFAULT, pictureMarginTypes.BIG_TOP, pictureMarginTypes.BIG_BOTTOM, pictureMarginTypes.BIG_VERTICAL])
|
46
46
|
};
|
47
47
|
var _default = TextBoxPicture;
|
48
48
|
exports["default"] = _default;
|