@megafon/ui-shared 2.0.0-beta.224 → 2.0.0-beta.228

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 (56) hide show
  1. package/CHANGELOG.md +47 -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 +16 -12
  8. package/dist/es/components/Card/Card.d.ts +2 -2
  9. package/dist/es/components/Card/Card.js +4 -5
  10. package/dist/es/components/Container/Container.css +16 -16
  11. package/dist/es/components/Instructions/Instructions.css +26 -26
  12. package/dist/es/components/PageTitle/PageTitle.css +1 -1
  13. package/dist/es/components/Partners/Partners.css +2 -2
  14. package/dist/es/components/PictureWithDescription/PictureWithDescription.css +2 -2
  15. package/dist/es/components/Property/Property.css +12 -12
  16. package/dist/es/components/Property/PropertyDescription.css +1 -1
  17. package/dist/es/components/Steps/Steps.css +2 -2
  18. package/dist/es/components/Steps/StepsItem.css +3 -3
  19. package/dist/es/components/StoreBanner/StoreBanner.css +9 -9
  20. package/dist/es/components/StoreButton/StoreButton.css +2 -2
  21. package/dist/es/components/Table/Table.css +48 -48
  22. package/dist/es/components/TextBox/TextBoxPicture.css +23 -0
  23. package/dist/es/components/TextBox/TextBoxPicture.d.ts +17 -0
  24. package/dist/es/components/TextBox/TextBoxPicture.js +31 -0
  25. package/dist/es/components/VideoBanner/VideoBanner.css +8 -8
  26. package/dist/es/components/VideoBlock/VideoBlock.css +3 -3
  27. package/dist/es/index.d.ts +1 -0
  28. package/dist/es/index.js +1 -0
  29. package/dist/lib/components/BenefitsIcons/style/BenefitsIcons.css +1 -1
  30. package/dist/lib/components/BenefitsIcons/style/BenefitsIconsTile.css +2 -2
  31. package/dist/lib/components/BenefitsPictures/BenfitsPictures.css +1 -1
  32. package/dist/lib/components/Breadcrumbs/Breadcrumbs.css +1 -1
  33. package/dist/lib/components/ButtonBanner/ButtonBanner.css +6 -6
  34. package/dist/lib/components/Card/Card.css +16 -12
  35. package/dist/lib/components/Card/Card.d.ts +2 -2
  36. package/dist/lib/components/Card/Card.js +3 -4
  37. package/dist/lib/components/Container/Container.css +16 -16
  38. package/dist/lib/components/Instructions/Instructions.css +26 -26
  39. package/dist/lib/components/PageTitle/PageTitle.css +1 -1
  40. package/dist/lib/components/Partners/Partners.css +2 -2
  41. package/dist/lib/components/PictureWithDescription/PictureWithDescription.css +2 -2
  42. package/dist/lib/components/Property/Property.css +12 -12
  43. package/dist/lib/components/Property/PropertyDescription.css +1 -1
  44. package/dist/lib/components/Steps/Steps.css +2 -2
  45. package/dist/lib/components/Steps/StepsItem.css +3 -3
  46. package/dist/lib/components/StoreBanner/StoreBanner.css +9 -9
  47. package/dist/lib/components/StoreButton/StoreButton.css +2 -2
  48. package/dist/lib/components/Table/Table.css +48 -48
  49. package/dist/lib/components/TextBox/TextBoxPicture.css +23 -0
  50. package/dist/lib/components/TextBox/TextBoxPicture.d.ts +17 -0
  51. package/dist/lib/components/TextBox/TextBoxPicture.js +48 -0
  52. package/dist/lib/components/VideoBanner/VideoBanner.css +8 -8
  53. package/dist/lib/components/VideoBlock/VideoBlock.css +3 -3
  54. package/dist/lib/index.d.ts +1 -0
  55. package/dist/lib/index.js +8 -0
  56. package/package.json +9 -12
@@ -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
- }
@@ -0,0 +1,23 @@
1
+ h1,
2
+ h2,
3
+ h3,
4
+ h4,
5
+ h5 {
6
+ margin: 0;
7
+ }
8
+ .mfui-beta-text-box-picture_margin_default {
9
+ margin: 16px 0;
10
+ }
11
+ .mfui-beta-text-box-picture_margin_big-top {
12
+ margin: 24px 0 16px;
13
+ }
14
+ .mfui-beta-text-box-picture_margin_big-bottom {
15
+ margin: 16px 0 24px;
16
+ }
17
+ .mfui-beta-text-box-picture_margin_big-vertical {
18
+ margin: 24px 0;
19
+ }
20
+ .mfui-beta-text-box-picture__img {
21
+ width: 100%;
22
+ height: 100%;
23
+ }
@@ -0,0 +1,17 @@
1
+ import * as React from 'react';
2
+ import './TextBoxPicture.less';
3
+ export declare const pictureMarginTypes: {
4
+ readonly DEFAULT: "default";
5
+ readonly BIG_TOP: "big-top";
6
+ readonly BIG_BOTTOM: "big-bottom";
7
+ readonly BIG_VERTICAL: "big-vertical";
8
+ };
9
+ declare type PictureMarginTypesType = typeof pictureMarginTypes[keyof typeof pictureMarginTypes];
10
+ export interface ITextBoxPictureProps {
11
+ /** URL картинки */
12
+ url: string;
13
+ /** Значение вертикальных отступов */
14
+ margin?: PictureMarginTypesType;
15
+ }
16
+ declare const TextBoxPicture: React.FC<ITextBoxPictureProps>;
17
+ export default TextBoxPicture;
@@ -0,0 +1,31 @@
1
+ import * as React from 'react';
2
+ import * as PropTypes from 'prop-types';
3
+ import { cnCreate } from '@megafon/ui-helpers';
4
+ import "./TextBoxPicture.css";
5
+ export var pictureMarginTypes = {
6
+ DEFAULT: 'default',
7
+ BIG_TOP: 'big-top',
8
+ BIG_BOTTOM: 'big-bottom',
9
+ BIG_VERTICAL: 'big-vertical'
10
+ };
11
+ var cn = cnCreate('mfui-beta-text-box-picture');
12
+
13
+ var TextBoxPicture = function TextBoxPicture(_ref) {
14
+ var url = _ref.url,
15
+ _ref$margin = _ref.margin,
16
+ margin = _ref$margin === void 0 ? pictureMarginTypes.DEFAULT : _ref$margin;
17
+ return /*#__PURE__*/React.createElement("div", {
18
+ className: cn({
19
+ margin: margin
20
+ })
21
+ }, /*#__PURE__*/React.createElement("img", {
22
+ className: cn('img'),
23
+ src: url
24
+ }));
25
+ };
26
+
27
+ TextBoxPicture.propTypes = {
28
+ url: PropTypes.string.isRequired,
29
+ margin: PropTypes.oneOf([pictureMarginTypes.DEFAULT, pictureMarginTypes.BIG_TOP, pictureMarginTypes.BIG_BOTTOM, pictureMarginTypes.BIG_VERTICAL])
30
+ };
31
+ export default TextBoxPicture;
@@ -11,26 +11,26 @@ h5 {
11
11
  }
12
12
  @media screen and (min-width: 1280px) {
13
13
  .mfui-beta-video-banner {
14
- margin-left: -80px;
15
14
  margin-right: -80px;
15
+ margin-left: -80px;
16
16
  }
17
17
  }
18
18
  @media screen and (min-width: 1024px) and (max-width: 1279px) {
19
19
  .mfui-beta-video-banner {
20
- margin-left: -64px;
21
20
  margin-right: -64px;
21
+ margin-left: -64px;
22
22
  }
23
23
  }
24
24
  @media screen and (min-width: 768px) and (max-width: 1023px) {
25
25
  .mfui-beta-video-banner {
26
- margin-left: -48px;
27
26
  margin-right: -48px;
27
+ margin-left: -48px;
28
28
  }
29
29
  }
30
30
  @media screen and (max-width: 767px) {
31
31
  .mfui-beta-video-banner {
32
- margin-left: -16px;
33
32
  margin-right: -16px;
33
+ margin-left: -16px;
34
34
  }
35
35
  }
36
36
  .mfui-beta-video-banner__wrapper {
@@ -76,17 +76,17 @@ h5 {
76
76
  .mfui-beta-video-banner__background-image,
77
77
  .mfui-beta-video-banner__video {
78
78
  position: absolute;
79
- left: 50%;
80
79
  top: 50%;
80
+ left: 50%;
81
81
  -webkit-transform: translate(-50%, -50%);
82
82
  transform: translate(-50%, -50%);
83
83
  }
84
84
  .mfui-beta-video-banner__background-image {
85
85
  width: 100%;
86
86
  height: 100%;
87
+ background-repeat: no-repeat;
87
88
  background-position: center;
88
89
  background-size: cover;
89
- background-repeat: no-repeat;
90
90
  }
91
91
  .mfui-beta-video-banner__content {
92
92
  position: relative;
@@ -160,14 +160,14 @@ h5 {
160
160
  display: -webkit-box;
161
161
  display: -ms-flexbox;
162
162
  display: flex;
163
+ -ms-flex-wrap: wrap;
164
+ flex-wrap: wrap;
163
165
  -webkit-box-align: center;
164
166
  -ms-flex-align: center;
165
167
  align-items: center;
166
168
  -webkit-box-pack: start;
167
169
  -ms-flex-pack: start;
168
170
  justify-content: flex-start;
169
- -ms-flex-wrap: wrap;
170
- flex-wrap: wrap;
171
171
  margin: -24px -10px 0;
172
172
  }
173
173
  @media screen and (max-width: 767px) {
@@ -21,10 +21,10 @@ h5 {
21
21
  -webkit-box-direction: normal;
22
22
  -ms-flex-direction: column;
23
23
  flex-direction: column;
24
- height: 100%;
25
24
  -webkit-box-pack: center;
26
25
  -ms-flex-pack: center;
27
26
  justify-content: center;
27
+ height: 100%;
28
28
  }
29
29
  @media screen and (max-width: 767px) {
30
30
  .mfui-beta-video-block__content {
@@ -38,8 +38,8 @@ h5 {
38
38
  }
39
39
  @media screen and (min-width: 768px) {
40
40
  .mfui-beta-video-block__content {
41
- padding-right: 20px;
42
41
  margin-right: 20px;
42
+ padding-right: 20px;
43
43
  }
44
44
  }
45
45
  .mfui-beta-video-block__header {
@@ -54,8 +54,8 @@ h5 {
54
54
  margin-top: 24px;
55
55
  }
56
56
  .mfui-beta-video-block__button {
57
- margin-top: 32px;
58
57
  width: 171px;
58
+ margin-top: 32px;
59
59
  }
60
60
  @media screen and (max-width: 767px) {
61
61
  .mfui-beta-video-block__button {
@@ -28,6 +28,7 @@ export { default as TableCell } from './components/Table/TableCell';
28
28
  export { default as TableRow } from './components/Table/TableRow';
29
29
  export { default as TabsBox } from './components/TabsBox/TabsBox';
30
30
  export { default as TextBox } from './components/TextBox/TextBox';
31
+ export { default as TextBoxPicture } from './components/TextBox/TextBoxPicture';
31
32
  export { default as TitleDescriptionBox } from './components/TitleDescriptionBox/TitleDescriptionBox';
32
33
  export { default as VideoBanner } from './components/VideoBanner/VideoBanner';
33
34
  export { default as VideoBlock } from './components/VideoBlock/VideoBlock';
package/dist/es/index.js CHANGED
@@ -28,6 +28,7 @@ export { default as TableCell } from "./components/Table/TableCell";
28
28
  export { default as TableRow } from "./components/Table/TableRow";
29
29
  export { default as TabsBox } from "./components/TabsBox/TabsBox";
30
30
  export { default as TextBox } from "./components/TextBox/TextBox";
31
+ export { default as TextBoxPicture } from "./components/TextBox/TextBoxPicture";
31
32
  export { default as TitleDescriptionBox } from "./components/TitleDescriptionBox/TitleDescriptionBox";
32
33
  export { default as VideoBanner } from "./components/VideoBanner/VideoBanner";
33
34
  export { default as VideoBlock } from "./components/VideoBlock/VideoBlock";
@@ -6,8 +6,8 @@ h5 {
6
6
  margin: 0;
7
7
  }
8
8
  .mfui-beta-benefits-icons {
9
- font-size: 10px;
10
9
  overflow: hidden;
10
+ font-size: 10px;
11
11
  }
12
12
  .mfui-beta-benefits-icons__inner {
13
13
  margin-bottom: -48px;
@@ -23,8 +23,8 @@ h5 {
23
23
  margin-bottom: 0;
24
24
  }
25
25
  .mfui-beta-benefits-icons-tile__svg-icon {
26
- width: 44px;
27
- height: 44px;
26
+ width: 40px;
27
+ height: 40px;
28
28
  overflow: hidden;
29
29
  }
30
30
  .mfui-beta-benefits-icons-tile_icon-position_left-side {
@@ -11,8 +11,8 @@ h5 {
11
11
  }
12
12
  .mfui-beta-benefits-pictures__img_h-align_center {
13
13
  display: block;
14
- margin-left: auto;
15
14
  margin-right: auto;
15
+ margin-left: auto;
16
16
  }
17
17
  .mfui-beta-benefits-pictures__title {
18
18
  margin-bottom: 12px;
@@ -26,8 +26,8 @@ h5 {
26
26
  }
27
27
  .mfui-beta-breadcrumbs__item {
28
28
  position: relative;
29
- padding-left: 22px;
30
29
  margin-right: 10px;
30
+ padding-left: 22px;
31
31
  }
32
32
  .mfui-beta-breadcrumbs__item:before {
33
33
  content: '→';
@@ -19,9 +19,9 @@ h5 {
19
19
  .mfui-beta-button-banner:before {
20
20
  content: '';
21
21
  position: absolute;
22
- left: 0;
23
22
  top: 0;
24
23
  bottom: 0;
24
+ left: 0;
25
25
  width: 12px;
26
26
  background-color: #00B956;
27
27
  border-radius: 0 12px 12px 0;
@@ -33,8 +33,8 @@ h5 {
33
33
  }
34
34
  @media screen and (max-width: 767px) {
35
35
  .mfui-beta-button-banner:before {
36
- bottom: auto;
37
36
  right: 0;
37
+ bottom: auto;
38
38
  width: auto;
39
39
  height: 12px;
40
40
  }
@@ -45,8 +45,8 @@ h5 {
45
45
  }
46
46
  @media screen and (max-width: 767px) {
47
47
  .mfui-beta-button-banner__content {
48
- text-align: center;
49
48
  padding: 36px 16px 32px;
49
+ text-align: center;
50
50
  }
51
51
  }
52
52
  @media screen and (min-width: 768px) and (max-width: 1023px) {
@@ -65,8 +65,6 @@ h5 {
65
65
  }
66
66
  }
67
67
  .mfui-beta-button-banner__media {
68
- overflow: hidden;
69
- height: 100%;
70
68
  display: -webkit-box;
71
69
  display: -ms-flexbox;
72
70
  display: flex;
@@ -76,9 +74,11 @@ h5 {
76
74
  -webkit-box-pack: center;
77
75
  -ms-flex-pack: center;
78
76
  justify-content: center;
77
+ height: 100%;
78
+ padding: 0 20px;
79
+ overflow: hidden;
79
80
  background-repeat: no-repeat;
80
81
  background-position: center;
81
- padding: 0 20px;
82
82
  border-radius: 0 8px 8px 0;
83
83
  }
84
84
  @media screen and (max-width: 767px) {
@@ -10,10 +10,10 @@ h5 {
10
10
  display: -ms-flexbox;
11
11
  display: flex;
12
12
  border-radius: 8px;
13
+ overflow: hidden;
14
+ background-color: #FFFFFF;
13
15
  -webkit-box-shadow: 0 0.25px 3px rgba(0, 0, 0, 0.25);
14
16
  box-shadow: 0 0.25px 3px rgba(0, 0, 0, 0.25);
15
- background-color: #FFFFFF;
16
- overflow: hidden;
17
17
  }
18
18
  .mfui-beta-card__inner {
19
19
  display: -webkit-box;
@@ -28,9 +28,9 @@ h5 {
28
28
  flex-grow: 0;
29
29
  -ms-flex-negative: 1;
30
30
  flex-shrink: 1;
31
- width: 100%;
32
31
  -webkit-box-sizing: border-box;
33
32
  box-sizing: border-box;
33
+ width: 100%;
34
34
  padding: 32px 20px;
35
35
  }
36
36
  @media screen and (max-width: 767px) {
@@ -39,7 +39,11 @@ h5 {
39
39
  }
40
40
  }
41
41
  .mfui-beta-card__text {
42
+ font-size: 15px;
43
+ line-height: 24px;
44
+ font-weight: 400;
42
45
  margin-top: 12px;
46
+ color: #333333;
43
47
  }
44
48
  .mfui-beta-card__btns-wrapper {
45
49
  display: -webkit-box;
@@ -47,14 +51,14 @@ h5 {
47
51
  display: flex;
48
52
  -ms-flex-wrap: wrap;
49
53
  flex-wrap: wrap;
50
- -webkit-box-pack: space-evenly;
51
- -ms-flex-pack: space-evenly;
52
- justify-content: space-evenly;
53
54
  -webkit-box-align: center;
54
55
  -ms-flex-align: center;
55
56
  align-items: center;
56
- padding-top: 12px;
57
+ -webkit-box-pack: space-evenly;
58
+ -ms-flex-pack: space-evenly;
59
+ justify-content: space-evenly;
57
60
  margin-top: auto;
61
+ padding-top: 12px;
58
62
  }
59
63
  .mfui-beta-card__btns-wrapper_left-align {
60
64
  -webkit-box-pack: start;
@@ -88,21 +92,21 @@ h5 {
88
92
  display: -webkit-box;
89
93
  display: -ms-flexbox;
90
94
  display: flex;
91
- -webkit-box-pack: center;
92
- -ms-flex-pack: center;
93
- justify-content: center;
94
95
  -webkit-box-align: center;
95
96
  -ms-flex-align: center;
96
97
  align-items: center;
98
+ -webkit-box-pack: center;
99
+ -ms-flex-pack: center;
100
+ justify-content: center;
97
101
  margin-top: -32px;
98
- margin-left: -20px;
99
102
  margin-right: -20px;
103
+ margin-left: -20px;
100
104
  }
101
105
  @media screen and (max-width: 767px) {
102
106
  .mfui-beta-card__pic-wrapper_img {
103
107
  margin-top: -24px;
104
- margin-left: -16px;
105
108
  margin-right: -16px;
109
+ margin-left: -16px;
106
110
  }
107
111
  }
108
112
  .mfui-beta-card__pic-wrapper_object-fit_fill img {
@@ -43,9 +43,9 @@ export interface ICard {
43
43
  /** Иконка в карточке */
44
44
  svgSrc?: React.ReactNode;
45
45
  /** Заголовок карточки */
46
- title: string;
46
+ title: string | React.ReactNode[] | React.ReactNode;
47
47
  /** Текст карточки */
48
- text?: string;
48
+ text?: string | React.ReactNode[] | React.ReactNode;
49
49
  /** Данные для кнопки */
50
50
  button?: IButton;
51
51
  /** Данные для ссылки */
@@ -156,8 +156,7 @@ var Card = function Card(_ref) {
156
156
  }, /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, renderImage(), /*#__PURE__*/_react["default"].createElement(_uiCore.Header, {
157
157
  as: "h3",
158
158
  className: cn('title')
159
- }, title), !!text && /*#__PURE__*/_react["default"].createElement(_uiCore.Paragraph, {
160
- hasMargin: false,
159
+ }, title), !!text && /*#__PURE__*/_react["default"].createElement("div", {
161
160
  className: cn('text')
162
161
  }, text), renderBtnsWrapper())));
163
162
  };
@@ -176,8 +175,8 @@ Card.propTypes = {
176
175
  }), _propTypes["default"].any])]),
177
176
  imageSrc: _propTypes["default"].string,
178
177
  svgSrc: _propTypes["default"].node,
179
- title: _propTypes["default"].string.isRequired,
180
- text: _propTypes["default"].string,
178
+ title: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].node, _propTypes["default"].arrayOf(_propTypes["default"].node)]).isRequired,
179
+ text: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].node, _propTypes["default"].arrayOf(_propTypes["default"].node)]),
181
180
  button: _propTypes["default"].shape({
182
181
  title: _propTypes["default"].string.isRequired,
183
182
  href: _propTypes["default"].string.isRequired,