@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.
Files changed (48) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/es/components/BenefitsIcons/style/BenefitsIcons.css +1 -1
  3. package/dist/es/components/BenefitsIcons/style/BenefitsIconsTile.css +2 -2
  4. package/dist/es/components/BenefitsPictures/BenfitsPictures.css +1 -1
  5. package/dist/es/components/Breadcrumbs/Breadcrumbs.css +1 -1
  6. package/dist/es/components/ButtonBanner/ButtonBanner.css +6 -6
  7. package/dist/es/components/Card/Card.css +13 -13
  8. package/dist/es/components/Container/Container.css +16 -16
  9. package/dist/es/components/Instructions/Instructions.css +26 -26
  10. package/dist/es/components/PageTitle/PageTitle.css +1 -1
  11. package/dist/es/components/Partners/Partners.css +2 -2
  12. package/dist/es/components/PictureWithDescription/PictureWithDescription.css +2 -2
  13. package/dist/es/components/Property/Property.css +11 -11
  14. package/dist/es/components/Property/PropertyDescription.css +1 -1
  15. package/dist/es/components/Steps/Steps.css +2 -2
  16. package/dist/es/components/Steps/StepsItem.css +3 -3
  17. package/dist/es/components/StoreBanner/StoreBanner.css +9 -9
  18. package/dist/es/components/StoreButton/StoreButton.css +2 -2
  19. package/dist/es/components/Table/Table.css +48 -48
  20. package/dist/es/components/TextBox/TextBoxPicture.css +3 -3
  21. package/dist/es/components/TextBox/TextBoxPicture.d.ts +3 -3
  22. package/dist/es/components/TextBox/TextBoxPicture.js +4 -4
  23. package/dist/es/components/VideoBanner/VideoBanner.css +8 -8
  24. package/dist/es/components/VideoBlock/VideoBlock.css +3 -3
  25. package/dist/lib/components/BenefitsIcons/style/BenefitsIcons.css +1 -1
  26. package/dist/lib/components/BenefitsIcons/style/BenefitsIconsTile.css +2 -2
  27. package/dist/lib/components/BenefitsPictures/BenfitsPictures.css +1 -1
  28. package/dist/lib/components/Breadcrumbs/Breadcrumbs.css +1 -1
  29. package/dist/lib/components/ButtonBanner/ButtonBanner.css +6 -6
  30. package/dist/lib/components/Card/Card.css +13 -13
  31. package/dist/lib/components/Container/Container.css +16 -16
  32. package/dist/lib/components/Instructions/Instructions.css +26 -26
  33. package/dist/lib/components/PageTitle/PageTitle.css +1 -1
  34. package/dist/lib/components/Partners/Partners.css +2 -2
  35. package/dist/lib/components/PictureWithDescription/PictureWithDescription.css +2 -2
  36. package/dist/lib/components/Property/Property.css +11 -11
  37. package/dist/lib/components/Property/PropertyDescription.css +1 -1
  38. package/dist/lib/components/Steps/Steps.css +2 -2
  39. package/dist/lib/components/Steps/StepsItem.css +3 -3
  40. package/dist/lib/components/StoreBanner/StoreBanner.css +9 -9
  41. package/dist/lib/components/StoreButton/StoreButton.css +2 -2
  42. package/dist/lib/components/Table/Table.css +48 -48
  43. package/dist/lib/components/TextBox/TextBoxPicture.css +3 -3
  44. package/dist/lib/components/TextBox/TextBoxPicture.d.ts +3 -3
  45. package/dist/lib/components/TextBox/TextBoxPicture.js +4 -4
  46. package/dist/lib/components/VideoBanner/VideoBanner.css +8 -8
  47. package/dist/lib/components/VideoBlock/VideoBlock.css +3 -3
  48. 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
- display: block;
106
+ right: 0;
107
107
  bottom: 0;
108
108
  left: 0;
109
- right: 0;
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
- z-index: 1;
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
- z-index: 1;
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 {
@@ -46,8 +46,8 @@ h5 {
46
46
  position: absolute;
47
47
  top: 50%;
48
48
  left: 50%;
49
+ max-width: 100%;
50
+ max-height: 100%;
49
51
  -webkit-transform: translate(-50%, -50%);
50
52
  transform: translate(-50%, -50%);
51
- max-height: 100%;
52
- max-width: 100%;
53
53
  }
@@ -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
- display: inline-block;
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
- -webkit-box-pack: end;
78
- -ms-flex-pack: end;
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
- -ms-flex-negative: 0;
84
- flex-shrink: 0;
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;
@@ -6,8 +6,8 @@ h5 {
6
6
  margin: 0;
7
7
  }
8
8
  .mfui-beta-property-description__collapse {
9
- font-size: 12px;
10
9
  color: #34AAF2;
10
+ font-size: 12px;
11
11
  -webkit-text-decoration: underline dashed #34AAF2;
12
12
  text-decoration: underline dashed #34AAF2;
13
13
  cursor: pointer;
@@ -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
- background-size: cover;
2
+ border-radius: 8px;
3
3
  background-repeat: no-repeat;
4
4
  background-position: center;
5
- border-radius: 8px;
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
- width: 100%;
51
+ z-index: 2;
34
52
  display: block;
35
- grid-column-end: 4;
36
53
  grid-column-start: 1;
37
- z-index: 2;
38
- margin-bottom: -6px;
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
- position: relative;
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-picture_margin_big_top_margin {
11
+ .mfui-beta-text-box-picture_margin_big-top {
12
12
  margin: 24px 0 16px;
13
13
  }
14
- .mfui-beta-text-box-picture_margin_big_bottom_margin {
14
+ .mfui-beta-text-box-picture_margin_big-bottom {
15
15
  margin: 16px 0 24px;
16
16
  }
17
- .mfui-beta-text-box-picture_margin_big_vertical_margin {
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 BIG_TOP_MARGIN: "big_top_margin";
6
- readonly BIG_BOTTOM_MARGIN: "big_bottom_margin";
7
- readonly BIG_VERTICAL_MARGIN: "big_vertical_margin";
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
- BIG_TOP_MARGIN: 'big_top_margin',
23
- BIG_BOTTOM_MARGIN: 'big_bottom_margin',
24
- BIG_VERTICAL_MARGIN: 'big_vertical_margin'
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.BIG_TOP_MARGIN, pictureMarginTypes.BIG_BOTTOM_MARGIN, pictureMarginTypes.BIG_VERTICAL_MARGIN])
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;