@megafon/ui-shared 5.15.0 → 6.0.0-beta.1
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/dist/es/components/AccordionBox/AccordionBox.css +1 -15
- package/dist/es/components/AccordionBox/AccordionBox.d.ts +2 -2
- package/dist/es/components/AccordionBox/AccordionBox.js +6 -49
- package/dist/es/components/AudioPlayer/AudioPlayer.d.ts +2 -2
- package/dist/es/components/AudioPlayer/AudioPlayer.js +11 -27
- package/dist/es/components/AudioPlayer/AudioProgress.d.ts +1 -1
- package/dist/es/components/AudioPlayer/AudioProgress.js +10 -22
- package/dist/es/components/AudioPlayer/AudioRange.d.ts +1 -1
- package/dist/es/components/AudioPlayer/AudioRange.js +8 -10
- package/dist/es/components/AudioPlayer/AudioVolume.d.ts +1 -1
- package/dist/es/components/AudioPlayer/AudioVolume.js +3 -12
- package/dist/es/components/AudioPlayer/hooks/useTrackDuration.js +4 -10
- package/dist/es/components/AudioPlayer/style/AudioPlayer.css +1 -58
- package/dist/es/components/AudioPlayer/style/AudioProgress.css +1 -35
- package/dist/es/components/AudioPlayer/style/AudioRange.css +1 -68
- package/dist/es/components/AudioPlayer/style/AudioVolume.css +1 -34
- package/dist/es/components/AudioPlayer/timerFormatUtil.js +1 -9
- package/dist/es/components/BannerBox/BannerBox.d.ts +1 -1
- package/dist/es/components/BannerBox/BannerBox.js +3 -12
- package/dist/es/components/BenefitsIcons/BenefitsIcons.d.ts +1 -1
- package/dist/es/components/BenefitsIcons/BenefitsIcons.js +23 -64
- package/dist/es/components/BenefitsIcons/BenefitsIconsTile.d.ts +1 -1
- package/dist/es/components/BenefitsIcons/BenefitsIconsTile.js +9 -36
- package/dist/es/components/BenefitsIcons/helpers.d.ts +3 -3
- package/dist/es/components/BenefitsIcons/helpers.js +6 -20
- package/dist/es/components/BenefitsIcons/style/BenefitsIcons.css +1 -38
- package/dist/es/components/BenefitsIcons/style/BenefitsIconsTile.css +1 -90
- package/dist/es/components/BenefitsIcons/types.d.ts +5 -5
- package/dist/es/components/BenefitsPictures/BenefitsPictures.d.ts +1 -1
- package/dist/es/components/BenefitsPictures/BenefitsPictures.js +19 -49
- package/dist/es/components/BenefitsPictures/BenfitsPictures.css +1 -43
- package/dist/es/components/BenefitsPictures/helpers.d.ts +2 -2
- package/dist/es/components/BenefitsPictures/helpers.js +0 -14
- package/dist/es/components/BenefitsPictures/types.d.ts +3 -3
- package/dist/es/components/BenefitsPictures/types.js +1 -0
- package/dist/es/components/Breadcrumbs/Breadcrumbs.css +1 -43
- package/dist/es/components/Breadcrumbs/Breadcrumbs.d.ts +6 -6
- package/dist/es/components/Breadcrumbs/Breadcrumbs.js +10 -39
- package/dist/es/components/Breadcrumbs/components/BreadcrumbsItem.css +1 -16
- package/dist/es/components/Breadcrumbs/components/BreadcrumbsItem.d.ts +4 -4
- package/dist/es/components/Breadcrumbs/components/BreadcrumbsItem.js +11 -36
- package/dist/es/components/ButtonBanner/ButtonBanner.css +1 -122
- package/dist/es/components/ButtonBanner/ButtonBanner.d.ts +7 -7
- package/dist/es/components/ButtonBanner/ButtonBanner.js +22 -53
- package/dist/es/components/ButtonLinkBox/ButtonLinkBox.css +1 -19
- package/dist/es/components/ButtonLinkBox/ButtonLinkBox.d.ts +3 -3
- package/dist/es/components/ButtonLinkBox/ButtonLinkBox.js +20 -51
- package/dist/es/components/Card/Card.css +1 -308
- package/dist/es/components/Card/Card.d.ts +3 -3
- package/dist/es/components/Card/Card.js +20 -109
- package/dist/es/components/Card/types.d.ts +9 -9
- package/dist/es/components/Card/types.js +1 -0
- package/dist/es/components/CardsBox/CardsBox.js +3 -14
- package/dist/es/components/CardsBox/helpers.d.ts +2 -2
- package/dist/es/components/CardsBox/helpers.js +0 -4
- package/dist/es/components/CarouselBox/CarouselBox.d.ts +2 -2
- package/dist/es/components/CarouselBox/CarouselBox.js +11 -24
- package/dist/es/components/Container/Container.css +1 -3101
- package/dist/es/components/Container/Container.d.ts +7 -5
- package/dist/es/components/Container/Container.js +10 -25
- package/dist/es/components/DownloadLinks/DownloadLink.css +1 -37
- package/dist/es/components/DownloadLinks/DownloadLink.d.ts +1 -1
- package/dist/es/components/DownloadLinks/DownloadLink.js +13 -44
- package/dist/es/components/DownloadLinks/DownloadLinks.css +1 -36
- package/dist/es/components/DownloadLinks/DownloadLinks.d.ts +3 -3
- package/dist/es/components/DownloadLinks/DownloadLinks.js +2 -13
- package/dist/es/components/FaqWrapper/FaqWrapper.d.ts +5 -2
- package/dist/es/components/FaqWrapper/FaqWrapper.js +1 -3
- package/dist/es/components/ImageBanner/ImageBanner.css +1 -239
- package/dist/es/components/ImageBanner/ImageBanner.d.ts +14 -16
- package/dist/es/components/ImageBanner/ImageBanner.js +41 -111
- package/dist/es/components/Instructions/Instructions.css +1 -790
- package/dist/es/components/Instructions/Instructions.d.ts +11 -11
- package/dist/es/components/Instructions/Instructions.js +41 -94
- package/dist/es/components/NotificationBox/NotificationBox.css +1 -0
- package/dist/es/components/NotificationBox/NotificationBox.d.ts +4 -4
- package/dist/es/components/NotificationBox/NotificationBox.js +5 -19
- package/dist/es/components/PageTitle/PageTitle.css +1 -80
- package/dist/es/components/PageTitle/PageTitle.d.ts +2 -2
- package/dist/es/components/PageTitle/PageTitle.js +12 -37
- package/dist/es/components/Partners/Partners.css +1 -53
- package/dist/es/components/Partners/Partners.d.ts +2 -2
- package/dist/es/components/Partners/Partners.js +17 -48
- package/dist/es/components/PictureWithDescription/PictureWithDescription.css +1 -80
- package/dist/es/components/PictureWithDescription/PictureWithDescription.d.ts +4 -2
- package/dist/es/components/PictureWithDescription/PictureWithDescription.js +10 -28
- package/dist/es/components/Property/Property.css +1 -156
- package/dist/es/components/Property/Property.d.ts +4 -4
- package/dist/es/components/Property/Property.js +37 -81
- package/dist/es/components/Property/PropertyDescription.css +1 -17
- package/dist/es/components/Property/PropertyDescription.d.ts +3 -3
- package/dist/es/components/Property/PropertyDescription.js +8 -28
- package/dist/es/components/Property/types.d.ts +7 -5
- package/dist/es/components/Property/types.js +1 -0
- package/dist/es/components/Steps/Steps.css +1 -41
- package/dist/es/components/Steps/Steps.d.ts +2 -1
- package/dist/es/components/Steps/Steps.js +4 -19
- package/dist/es/components/Steps/StepsItem.css +1 -42
- package/dist/es/components/Steps/StepsItem.d.ts +2 -2
- package/dist/es/components/Steps/StepsItem.js +2 -9
- package/dist/es/components/StoreBanner/StoreBanner.css +1 -346
- package/dist/es/components/StoreBanner/StoreBanner.d.ts +5 -5
- package/dist/es/components/StoreBanner/StoreBanner.js +41 -97
- package/dist/es/components/StoreButton/StoreButton.css +1 -327
- package/dist/es/components/StoreButton/StoreButton.d.ts +3 -3
- package/dist/es/components/StoreButton/StoreButton.js +13 -44
- package/dist/es/components/Table/Table.css +1 -157
- package/dist/es/components/Table/Table.d.ts +1 -1
- package/dist/es/components/Table/Table.js +31 -51
- package/dist/es/components/Table/TableCell.js +0 -6
- package/dist/es/components/Table/TableRow.js +1 -10
- package/dist/es/components/TabsBox/TabsBox.d.ts +1 -1
- package/dist/es/components/TabsBox/TabsBox.js +4 -13
- package/dist/es/components/TextBox/TextBox.css +1 -25
- package/dist/es/components/TextBox/TextBox.d.ts +2 -1
- package/dist/es/components/TextBox/TextBox.js +8 -23
- package/dist/es/components/TextBox/TextBoxPicture.css +1 -27
- package/dist/es/components/TextBox/TextBoxPicture.d.ts +2 -2
- package/dist/es/components/TextBox/TextBoxPicture.js +5 -14
- package/dist/es/components/TextWithIcon/TextWithIcon.css +1 -10
- package/dist/es/components/TextWithIcon/TextWithIcon.d.ts +1 -1
- package/dist/es/components/TextWithIcon/TextWithIcon.js +6 -24
- package/dist/es/components/TextWithIcon/TextWithIconItem.css +1 -31
- package/dist/es/components/TextWithIcon/TextWithIconItem.d.ts +1 -1
- package/dist/es/components/TextWithIcon/TextWithIconItem.js +6 -21
- package/dist/es/components/TitleDescriptionBox/TitleDescriptionBox.css +1 -31
- package/dist/es/components/TitleDescriptionBox/TitleDescriptionBox.d.ts +1 -1
- package/dist/es/components/TitleDescriptionBox/TitleDescriptionBox.js +6 -23
- package/dist/es/components/VideoBanner/VideoBanner.css +1 -225
- package/dist/es/components/VideoBanner/VideoBanner.d.ts +7 -7
- package/dist/es/components/VideoBanner/VideoBanner.js +47 -110
- package/dist/es/components/VideoBlock/VideoBlock.css +1 -106
- package/dist/es/components/VideoBlock/VideoBlock.d.ts +4 -4
- package/dist/es/components/VideoBlock/VideoBlock.js +35 -75
- package/dist/es/helpers/getColumnConfig.d.ts +5 -1
- package/dist/lib/components/AccordionBox/AccordionBox.css +1 -15
- package/dist/lib/components/AccordionBox/AccordionBox.d.ts +2 -2
- package/dist/lib/components/AccordionBox/AccordionBox.js +10 -66
- package/dist/lib/components/AudioPlayer/AudioPlayer.d.ts +2 -2
- package/dist/lib/components/AudioPlayer/AudioPlayer.js +32 -56
- package/dist/lib/components/AudioPlayer/AudioProgress.d.ts +1 -1
- package/dist/lib/components/AudioPlayer/AudioProgress.js +12 -43
- package/dist/lib/components/AudioPlayer/AudioRange.d.ts +1 -1
- package/dist/lib/components/AudioPlayer/AudioRange.js +9 -17
- package/dist/lib/components/AudioPlayer/AudioVolume.d.ts +1 -1
- package/dist/lib/components/AudioPlayer/AudioVolume.js +4 -23
- package/dist/lib/components/AudioPlayer/hooks/useTrackDuration.js +5 -16
- package/dist/lib/components/AudioPlayer/style/AudioPlayer.css +1 -58
- package/dist/lib/components/AudioPlayer/style/AudioProgress.css +1 -35
- package/dist/lib/components/AudioPlayer/style/AudioRange.css +1 -68
- package/dist/lib/components/AudioPlayer/style/AudioVolume.css +1 -34
- package/dist/lib/components/AudioPlayer/timerFormatUtil.js +2 -13
- package/dist/lib/components/BannerBox/BannerBox.d.ts +1 -1
- package/dist/lib/components/BannerBox/BannerBox.js +7 -25
- package/dist/lib/components/BenefitsIcons/BenefitsIcons.d.ts +1 -1
- package/dist/lib/components/BenefitsIcons/BenefitsIcons.js +26 -86
- package/dist/lib/components/BenefitsIcons/BenefitsIconsTile.d.ts +1 -1
- package/dist/lib/components/BenefitsIcons/BenefitsIconsTile.js +13 -53
- package/dist/lib/components/BenefitsIcons/helpers.d.ts +3 -3
- package/dist/lib/components/BenefitsIcons/helpers.js +10 -37
- package/dist/lib/components/BenefitsIcons/style/BenefitsIcons.css +1 -38
- package/dist/lib/components/BenefitsIcons/style/BenefitsIconsTile.css +1 -90
- package/dist/lib/components/BenefitsIcons/types.d.ts +5 -5
- package/dist/lib/components/BenefitsIcons/types.js +5 -8
- package/dist/lib/components/BenefitsPictures/BenefitsPictures.d.ts +1 -1
- package/dist/lib/components/BenefitsPictures/BenefitsPictures.js +24 -71
- package/dist/lib/components/BenefitsPictures/BenfitsPictures.css +1 -43
- package/dist/lib/components/BenefitsPictures/helpers.d.ts +2 -2
- package/dist/lib/components/BenefitsPictures/helpers.js +9 -40
- package/dist/lib/components/BenefitsPictures/types.d.ts +3 -3
- package/dist/lib/components/BenefitsPictures/types.js +5 -1
- package/dist/lib/components/Breadcrumbs/Breadcrumbs.css +1 -43
- package/dist/lib/components/Breadcrumbs/Breadcrumbs.d.ts +6 -6
- package/dist/lib/components/Breadcrumbs/Breadcrumbs.js +18 -60
- package/dist/lib/components/Breadcrumbs/components/BreadcrumbsItem.css +1 -16
- package/dist/lib/components/Breadcrumbs/components/BreadcrumbsItem.d.ts +4 -4
- package/dist/lib/components/Breadcrumbs/components/BreadcrumbsItem.js +22 -55
- package/dist/lib/components/ButtonBanner/ButtonBanner.css +1 -122
- package/dist/lib/components/ButtonBanner/ButtonBanner.d.ts +7 -7
- package/dist/lib/components/ButtonBanner/ButtonBanner.js +40 -89
- package/dist/lib/components/ButtonLinkBox/ButtonLinkBox.css +1 -19
- package/dist/lib/components/ButtonLinkBox/ButtonLinkBox.d.ts +3 -3
- package/dist/lib/components/ButtonLinkBox/ButtonLinkBox.js +29 -72
- package/dist/lib/components/Card/Card.css +1 -308
- package/dist/lib/components/Card/Card.d.ts +3 -3
- package/dist/lib/components/Card/Card.js +58 -154
- package/dist/lib/components/Card/types.d.ts +9 -9
- package/dist/lib/components/Card/types.js +5 -1
- package/dist/lib/components/CardsBox/CardsBox.js +7 -31
- package/dist/lib/components/CardsBox/helpers.d.ts +2 -2
- package/dist/lib/components/CardsBox/helpers.js +1 -8
- package/dist/lib/components/CarouselBox/CarouselBox.d.ts +2 -2
- package/dist/lib/components/CarouselBox/CarouselBox.js +15 -39
- package/dist/lib/components/Container/Container.css +1 -3101
- package/dist/lib/components/Container/Container.d.ts +7 -5
- package/dist/lib/components/Container/Container.js +17 -39
- package/dist/lib/components/DownloadLinks/DownloadLink.css +1 -37
- package/dist/lib/components/DownloadLinks/DownloadLink.d.ts +1 -1
- package/dist/lib/components/DownloadLinks/DownloadLink.js +17 -60
- package/dist/lib/components/DownloadLinks/DownloadLinks.css +1 -36
- package/dist/lib/components/DownloadLinks/DownloadLinks.d.ts +3 -3
- package/dist/lib/components/DownloadLinks/DownloadLinks.js +8 -33
- package/dist/lib/components/FaqWrapper/FaqWrapper.d.ts +5 -2
- package/dist/lib/components/FaqWrapper/FaqWrapper.js +6 -9
- package/dist/lib/components/ImageBanner/ImageBanner.css +1 -239
- package/dist/lib/components/ImageBanner/ImageBanner.d.ts +14 -16
- package/dist/lib/components/ImageBanner/ImageBanner.js +64 -161
- package/dist/lib/components/Instructions/Instructions.css +1 -790
- package/dist/lib/components/Instructions/Instructions.d.ts +11 -11
- package/dist/lib/components/Instructions/Instructions.js +103 -186
- package/dist/lib/components/NotificationBox/NotificationBox.css +1 -0
- package/dist/lib/components/NotificationBox/NotificationBox.d.ts +4 -4
- package/dist/lib/components/NotificationBox/NotificationBox.js +9 -37
- package/dist/lib/components/PageTitle/PageTitle.css +1 -80
- package/dist/lib/components/PageTitle/PageTitle.d.ts +2 -2
- package/dist/lib/components/PageTitle/PageTitle.js +15 -52
- package/dist/lib/components/Partners/Partners.css +1 -53
- package/dist/lib/components/Partners/Partners.d.ts +2 -2
- package/dist/lib/components/Partners/Partners.js +21 -65
- package/dist/lib/components/PictureWithDescription/PictureWithDescription.css +1 -80
- package/dist/lib/components/PictureWithDescription/PictureWithDescription.d.ts +4 -2
- package/dist/lib/components/PictureWithDescription/PictureWithDescription.js +16 -46
- package/dist/lib/components/Property/Property.css +1 -156
- package/dist/lib/components/Property/Property.d.ts +4 -4
- package/dist/lib/components/Property/Property.js +60 -120
- package/dist/lib/components/Property/PropertyDescription.css +1 -17
- package/dist/lib/components/Property/PropertyDescription.d.ts +3 -3
- package/dist/lib/components/Property/PropertyDescription.js +15 -46
- package/dist/lib/components/Property/types.d.ts +7 -5
- package/dist/lib/components/Property/types.js +5 -1
- package/dist/lib/components/Steps/Steps.css +1 -41
- package/dist/lib/components/Steps/Steps.d.ts +2 -1
- package/dist/lib/components/Steps/Steps.js +8 -35
- package/dist/lib/components/Steps/StepsItem.css +1 -42
- package/dist/lib/components/Steps/StepsItem.d.ts +2 -2
- package/dist/lib/components/Steps/StepsItem.js +11 -23
- package/dist/lib/components/StoreBanner/StoreBanner.css +1 -346
- package/dist/lib/components/StoreBanner/StoreBanner.d.ts +5 -5
- package/dist/lib/components/StoreBanner/StoreBanner.js +47 -118
- package/dist/lib/components/StoreButton/StoreButton.css +1 -327
- package/dist/lib/components/StoreButton/StoreButton.d.ts +3 -3
- package/dist/lib/components/StoreButton/StoreButton.js +17 -63
- package/dist/lib/components/Table/Table.css +1 -157
- package/dist/lib/components/Table/Table.d.ts +1 -1
- package/dist/lib/components/Table/Table.js +35 -68
- package/dist/lib/components/Table/TableCell.js +4 -16
- package/dist/lib/components/Table/TableRow.js +5 -19
- package/dist/lib/components/TabsBox/TabBox.js +1 -4
- package/dist/lib/components/TabsBox/TabsBox.d.ts +1 -1
- package/dist/lib/components/TabsBox/TabsBox.js +8 -26
- package/dist/lib/components/TextBox/TextBox.css +1 -25
- package/dist/lib/components/TextBox/TextBox.d.ts +2 -1
- package/dist/lib/components/TextBox/TextBox.js +12 -36
- package/dist/lib/components/TextBox/TextBoxPicture.css +1 -27
- package/dist/lib/components/TextBox/TextBoxPicture.d.ts +2 -2
- package/dist/lib/components/TextBox/TextBoxPicture.js +11 -29
- package/dist/lib/components/TextWithIcon/TextWithIcon.css +1 -10
- package/dist/lib/components/TextWithIcon/TextWithIcon.d.ts +1 -1
- package/dist/lib/components/TextWithIcon/TextWithIcon.js +10 -39
- package/dist/lib/components/TextWithIcon/TextWithIconItem.css +1 -31
- package/dist/lib/components/TextWithIcon/TextWithIconItem.d.ts +1 -1
- package/dist/lib/components/TextWithIcon/TextWithIconItem.js +10 -37
- package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.css +1 -31
- package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.d.ts +1 -1
- package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.js +10 -40
- package/dist/lib/components/VideoBanner/VideoBanner.css +1 -225
- package/dist/lib/components/VideoBanner/VideoBanner.d.ts +7 -7
- package/dist/lib/components/VideoBanner/VideoBanner.js +83 -176
- package/dist/lib/components/VideoBlock/VideoBlock.css +1 -106
- package/dist/lib/components/VideoBlock/VideoBlock.d.ts +4 -4
- package/dist/lib/components/VideoBlock/VideoBlock.js +58 -114
- package/dist/lib/constants/throttleTime.js +2 -3
- package/dist/lib/helpers/getColumnConfig.d.ts +5 -1
- package/dist/lib/helpers/getColumnConfig.js +2 -5
- package/dist/lib/index.js +10 -57
- package/package.json +89 -92
- package/CHANGELOG.md +0 -3962
- package/dist/es/components/NotificationBox/style/NotificationBox.css +0 -28
- package/dist/es/components/StoreBanner/doc/img/android-screen.png +0 -0
- package/dist/es/components/StoreBanner/doc/img/qr-code.png +0 -0
- package/dist/es/components/StoreBanner/doc/img/screen.png +0 -0
- package/dist/lib/components/NotificationBox/style/NotificationBox.css +0 -28
- package/dist/lib/components/StoreBanner/doc/img/android-screen.png +0 -0
- package/dist/lib/components/StoreBanner/doc/img/qr-code.png +0 -0
- package/dist/lib/components/StoreBanner/doc/img/screen.png +0 -0
@@ -1,33 +1,25 @@
|
|
1
|
-
import "core-js/modules/es.parse-int.js";
|
2
1
|
import "core-js/modules/es.array.concat.js";
|
3
|
-
|
2
|
+
import "core-js/modules/es.parse-int.js";
|
4
3
|
var getMinutes = function getMinutes(sec) {
|
5
4
|
var min = parseInt("".concat(sec / 60), 10);
|
6
|
-
|
7
5
|
if (min < 10) {
|
8
6
|
return "0".concat(min);
|
9
7
|
}
|
10
|
-
|
11
8
|
return "".concat(min);
|
12
9
|
};
|
13
10
|
/**
|
14
11
|
* @param {Number} sec
|
15
12
|
* @returns {String}
|
16
13
|
*/
|
17
|
-
|
18
|
-
|
19
14
|
var getSeconds = function getSeconds(sec) {
|
20
15
|
if (sec < 10) {
|
21
16
|
return "0".concat(sec);
|
22
17
|
}
|
23
|
-
|
24
18
|
return "".concat(sec);
|
25
19
|
};
|
26
|
-
|
27
20
|
var timerFormat = function timerFormat(sec) {
|
28
21
|
var min = getMinutes(sec);
|
29
22
|
var seconds = getSeconds(sec % 60);
|
30
23
|
return "".concat(min, ":").concat(seconds);
|
31
24
|
};
|
32
|
-
|
33
25
|
export default timerFormat;
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as React from 'react';
|
2
2
|
import { Banner } from '@megafon/ui-core';
|
3
|
-
|
3
|
+
type BannerBoxProps = React.ComponentProps<typeof Banner>;
|
4
4
|
declare const BannerBox: React.FC<BannerBoxProps>;
|
5
5
|
export default BannerBox;
|
@@ -1,31 +1,22 @@
|
|
1
|
-
import "core-js/modules/es.array.index-of.js";
|
2
1
|
import "core-js/modules/es.symbol.js";
|
3
|
-
|
2
|
+
import "core-js/modules/es.array.index-of.js";
|
4
3
|
var __rest = this && this.__rest || function (s, e) {
|
5
4
|
var t = {};
|
6
|
-
|
7
|
-
for (var p in s) {
|
8
|
-
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
9
|
-
}
|
10
|
-
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
11
6
|
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
12
7
|
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
13
8
|
}
|
14
9
|
return t;
|
15
10
|
};
|
16
|
-
|
17
11
|
import * as React from 'react';
|
18
12
|
import { Banner } from '@megafon/ui-core';
|
19
13
|
import { cnCreate } from '@megafon/ui-helpers';
|
20
14
|
var cn = cnCreate('mfui-banner-box');
|
21
|
-
|
22
15
|
var BannerBox = function BannerBox(_a) {
|
23
16
|
var children = _a.children,
|
24
|
-
|
25
|
-
|
17
|
+
props = __rest(_a, ["children"]);
|
26
18
|
return /*#__PURE__*/React.createElement("div", {
|
27
19
|
className: cn()
|
28
20
|
}, /*#__PURE__*/React.createElement(Banner, props, children));
|
29
21
|
};
|
30
|
-
|
31
22
|
export default BannerBox;
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import * as React from 'react';
|
2
2
|
import { IconPosition, IBenefit, BackgroundType } from './types';
|
3
|
-
import './style/BenefitsIcons.
|
3
|
+
import './style/BenefitsIcons.scss';
|
4
4
|
export interface IBenefitsIcons {
|
5
5
|
/** Дополнительные data атрибуты к внутренним элементам */
|
6
6
|
dataAttrs?: {
|
@@ -1,44 +1,38 @@
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
2
2
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
3
3
|
import "core-js/modules/es.array.map.js";
|
4
|
-
import "core-js/modules/es.object.values.js";
|
5
4
|
import * as React from 'react';
|
6
5
|
import { Grid, GridColumn } from '@megafon/ui-core';
|
7
6
|
import { cnCreate, breakpoints, filterDataAttrs } from '@megafon/ui-helpers';
|
8
7
|
import throttle from 'lodash.throttle';
|
9
|
-
import PropTypes from 'prop-types';
|
10
8
|
import throttleTime from "../../constants/throttleTime";
|
11
9
|
import BenefitsIconsTile from "./BenefitsIconsTile";
|
12
10
|
import getMultiColumnConfig, { getOneColumnConfig } from "./helpers";
|
13
|
-
import { IconPositionEnum, ItemsAlignEnum
|
11
|
+
import { IconPositionEnum, ItemsAlignEnum } from "./types";
|
14
12
|
import "./style/BenefitsIcons.css";
|
15
13
|
var testIdPrefix = 'BenefitsIcons';
|
16
14
|
var cn = cnCreate('mfui-benefits-icons');
|
17
|
-
|
18
15
|
var BenefitsIcons = function BenefitsIcons(_ref) {
|
19
16
|
var dataAttrs = _ref.dataAttrs,
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
17
|
+
rootRef = _ref.rootRef,
|
18
|
+
_ref$iconPosition = _ref.iconPosition,
|
19
|
+
iconPosition = _ref$iconPosition === void 0 ? 'left-top' : _ref$iconPosition,
|
20
|
+
_ref$background = _ref.background,
|
21
|
+
background = _ref$background === void 0 ? 'transparent' : _ref$background,
|
22
|
+
_ref$inOneColumn = _ref.inOneColumn,
|
23
|
+
inOneColumn = _ref$inOneColumn === void 0 ? false : _ref$inOneColumn,
|
24
|
+
items = _ref.items,
|
25
|
+
className = _ref.className,
|
26
|
+
_ref$classes = _ref.classes,
|
27
|
+
classes = _ref$classes === void 0 ? {} : _ref$classes;
|
32
28
|
var _React$useState = React.useState(iconPosition === IconPositionEnum.CENTER_TOP ? 'center' : 'left'),
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
29
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
30
|
+
itemsAlign = _React$useState2[0],
|
31
|
+
setItemsAlign = _React$useState2[1];
|
37
32
|
var _React$useState3 = React.useState(iconPosition),
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
33
|
+
_React$useState4 = _slicedToArray(_React$useState3, 2),
|
34
|
+
localIconPosition = _React$useState4[0],
|
35
|
+
setLocalIconPosition = _React$useState4[1];
|
42
36
|
var resizeHandler = React.useCallback(function () {
|
43
37
|
if (window.innerWidth <= breakpoints.MOBILE_MIDDLE_END) {
|
44
38
|
setItemsAlign(ItemsAlignEnum.CENTER);
|
@@ -50,12 +44,10 @@ var BenefitsIcons = function BenefitsIcons(_ref) {
|
|
50
44
|
}, [iconPosition]);
|
51
45
|
React.useEffect(function () {
|
52
46
|
var resizeHandlerThrottled = throttle(resizeHandler, throttleTime.resize);
|
53
|
-
|
54
47
|
if (inOneColumn) {
|
55
48
|
resizeHandler();
|
56
49
|
window.addEventListener('resize', resizeHandlerThrottled);
|
57
50
|
}
|
58
|
-
|
59
51
|
return function () {
|
60
52
|
window.removeEventListener('resize', resizeHandlerThrottled);
|
61
53
|
};
|
@@ -82,11 +74,11 @@ var BenefitsIcons = function BenefitsIcons(_ref) {
|
|
82
74
|
}
|
83
75
|
}, items.map(function (_ref2, i) {
|
84
76
|
var title = _ref2.title,
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
77
|
+
text = _ref2.text,
|
78
|
+
icon = _ref2.icon,
|
79
|
+
alt = _ref2.alt,
|
80
|
+
itemClasses = _ref2.classes,
|
81
|
+
itemDataAttrs = _ref2.dataAttrs;
|
90
82
|
var columnConfig = inOneColumn ? getOneColumnConfig(iconPosition) : getMultiColumnConfig(iconPosition, items.length, i);
|
91
83
|
return /*#__PURE__*/React.createElement(GridColumn, _extends({
|
92
84
|
className: cn('column', [classes.gridColumn]),
|
@@ -109,37 +101,4 @@ var BenefitsIcons = function BenefitsIcons(_ref) {
|
|
109
101
|
}));
|
110
102
|
}))));
|
111
103
|
};
|
112
|
-
|
113
|
-
BenefitsIcons.propTypes = {
|
114
|
-
dataAttrs: PropTypes.shape({
|
115
|
-
root: PropTypes.objectOf(PropTypes.string.isRequired)
|
116
|
-
}),
|
117
|
-
rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
|
118
|
-
current: PropTypes.elementType
|
119
|
-
}), PropTypes.any])]),
|
120
|
-
iconPosition: PropTypes.oneOf(Object.values(IconPositionEnum)),
|
121
|
-
background: PropTypes.oneOf(Object.values(BackgroundEnum)),
|
122
|
-
inOneColumn: PropTypes.bool,
|
123
|
-
items: PropTypes.arrayOf(PropTypes.shape({
|
124
|
-
dataAttrs: PropTypes.shape({
|
125
|
-
root: PropTypes.objectOf(PropTypes.string.isRequired)
|
126
|
-
}),
|
127
|
-
classes: PropTypes.shape({
|
128
|
-
root: PropTypes.string,
|
129
|
-
icon: PropTypes.string,
|
130
|
-
title: PropTypes.string,
|
131
|
-
text: PropTypes.string,
|
132
|
-
contentWrapper: PropTypes.string
|
133
|
-
}),
|
134
|
-
title: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.arrayOf(PropTypes.node)]),
|
135
|
-
text: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.arrayOf(PropTypes.node)]),
|
136
|
-
icon: PropTypes.node.isRequired,
|
137
|
-
alt: PropTypes.string
|
138
|
-
}).isRequired).isRequired,
|
139
|
-
className: PropTypes.string,
|
140
|
-
classes: PropTypes.shape({
|
141
|
-
root: PropTypes.string,
|
142
|
-
item: PropTypes.string
|
143
|
-
})
|
144
|
-
};
|
145
104
|
export default BenefitsIcons;
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import * as React from 'react';
|
2
2
|
import { IBenefit, IconPosition, BackgroundType } from './types';
|
3
|
-
import './style/BenefitsIconsTile.
|
3
|
+
import './style/BenefitsIconsTile.scss';
|
4
4
|
export interface IBenefitsIconsTile extends IBenefit {
|
5
5
|
iconPosition?: IconPosition;
|
6
6
|
background?: BackgroundType;
|
@@ -1,26 +1,21 @@
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
2
|
-
import "core-js/modules/es.object.values.js";
|
3
2
|
import * as React from 'react';
|
4
3
|
import { Header } from '@megafon/ui-core';
|
5
4
|
import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
|
6
|
-
import PropTypes from 'prop-types';
|
7
|
-
import { IconPositionEnum, BackgroundEnum } from "./types";
|
8
5
|
import "./style/BenefitsIconsTile.css";
|
9
6
|
var testIdPrefix = 'BenefitsIconsTile';
|
10
7
|
var cn = cnCreate('mfui-benefits-icons-tile');
|
11
|
-
|
12
8
|
var BenefitsIconsTile = function BenefitsIconsTile(_ref) {
|
13
9
|
var dataAttrs = _ref.dataAttrs,
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
10
|
+
_ref$classes = _ref.classes,
|
11
|
+
classes = _ref$classes === void 0 ? {} : _ref$classes,
|
12
|
+
title = _ref.title,
|
13
|
+
text = _ref.text,
|
14
|
+
icon = _ref.icon,
|
15
|
+
iconPosition = _ref.iconPosition,
|
16
|
+
background = _ref.background,
|
17
|
+
alt = _ref.alt,
|
18
|
+
className = _ref.className;
|
24
19
|
var renderIcon = function renderIcon() {
|
25
20
|
if (typeof icon === 'string') {
|
26
21
|
return /*#__PURE__*/React.createElement("img", {
|
@@ -30,13 +25,11 @@ var BenefitsIconsTile = function BenefitsIconsTile(_ref) {
|
|
30
25
|
"data-testid": "".concat(testIdPrefix, "-img")
|
31
26
|
});
|
32
27
|
}
|
33
|
-
|
34
28
|
return /*#__PURE__*/React.createElement("div", {
|
35
29
|
className: cn('svg-icon', [classes.icon]),
|
36
30
|
"data-testid": "".concat(testIdPrefix, "-svg")
|
37
31
|
}, icon);
|
38
32
|
};
|
39
|
-
|
40
33
|
return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
|
41
34
|
className: cn({
|
42
35
|
'icon-position': iconPosition,
|
@@ -55,24 +48,4 @@ var BenefitsIconsTile = function BenefitsIconsTile(_ref) {
|
|
55
48
|
className: cn('content', [classes.text])
|
56
49
|
}, text))));
|
57
50
|
};
|
58
|
-
|
59
|
-
BenefitsIconsTile.propTypes = {
|
60
|
-
dataAttrs: PropTypes.shape({
|
61
|
-
root: PropTypes.objectOf(PropTypes.string.isRequired)
|
62
|
-
}),
|
63
|
-
className: PropTypes.string,
|
64
|
-
classes: PropTypes.shape({
|
65
|
-
root: PropTypes.string,
|
66
|
-
icon: PropTypes.string,
|
67
|
-
title: PropTypes.string,
|
68
|
-
text: PropTypes.string,
|
69
|
-
contentWrapper: PropTypes.string
|
70
|
-
}),
|
71
|
-
title: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.arrayOf(PropTypes.node)]),
|
72
|
-
text: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.arrayOf(PropTypes.node)]),
|
73
|
-
iconPosition: PropTypes.oneOf(Object.values(IconPositionEnum)),
|
74
|
-
background: PropTypes.oneOf(Object.values(BackgroundEnum)),
|
75
|
-
icon: PropTypes.node.isRequired,
|
76
|
-
alt: PropTypes.string
|
77
|
-
};
|
78
51
|
export default BenefitsIconsTile;
|
@@ -1,8 +1,8 @@
|
|
1
|
-
import { GridConfig } from './types';
|
1
|
+
import { GridConfig, IconPosition } from './types';
|
2
2
|
declare const getLeftSideConfig: (count: number, index: number) => GridConfig;
|
3
3
|
declare const getLeftTopConfig: (count: number, index: number) => GridConfig;
|
4
4
|
declare const getCenterTopConfig: (count: number, index: number) => GridConfig;
|
5
|
-
declare const getOneColumnConfig: (iconPosition:
|
6
|
-
declare const getMultiColumnConfig: (iconPosition:
|
5
|
+
declare const getOneColumnConfig: (iconPosition: IconPosition) => GridConfig;
|
6
|
+
declare const getMultiColumnConfig: (iconPosition: IconPosition, count: number, index: number) => GridConfig;
|
7
7
|
export default getMultiColumnConfig;
|
8
8
|
export { getLeftSideConfig, getLeftTopConfig, getCenterTopConfig, getOneColumnConfig };
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
2
|
-
import { IconPositionEnum } from "./types";
|
3
|
-
|
2
|
+
import { IconPositionEnum } from "./types";
|
3
|
+
// left-aligned column with left side icon
|
4
4
|
var getLeftSideConfig = function getLeftSideConfig(count, index) {
|
5
5
|
var everySecondWithoutOffset = index % 2 ? '1' : undefined;
|
6
6
|
var columnSize = {
|
@@ -8,7 +8,6 @@ var getLeftSideConfig = function getLeftSideConfig(count, index) {
|
|
8
8
|
desktop: '5',
|
9
9
|
tablet: '10'
|
10
10
|
};
|
11
|
-
|
12
11
|
switch (count) {
|
13
12
|
case 2:
|
14
13
|
case 4:
|
@@ -16,19 +15,16 @@ var getLeftSideConfig = function getLeftSideConfig(count, index) {
|
|
16
15
|
leftOffsetWide: everySecondWithoutOffset,
|
17
16
|
leftOffsetDesktop: everySecondWithoutOffset
|
18
17
|
});
|
19
|
-
|
20
18
|
default:
|
21
19
|
return _extends(_extends({}, columnSize), {
|
22
20
|
leftOffsetDesktop: everySecondWithoutOffset
|
23
21
|
});
|
24
22
|
}
|
25
|
-
};
|
26
|
-
|
27
|
-
|
23
|
+
};
|
24
|
+
// left-aligned column with left-aligned icon on top
|
28
25
|
var getLeftTopConfig = function getLeftTopConfig(count, index) {
|
29
26
|
var everySecondWithoutOffset = index % 2 ? '1' : undefined;
|
30
27
|
var everyThirdWithoutOffset = index % 3 ? '1' : undefined;
|
31
|
-
|
32
28
|
switch (count) {
|
33
29
|
case 2:
|
34
30
|
return {
|
@@ -39,7 +35,6 @@ var getLeftTopConfig = function getLeftTopConfig(count, index) {
|
|
39
35
|
leftOffsetDesktop: everySecondWithoutOffset,
|
40
36
|
leftOffsetTablet: everySecondWithoutOffset
|
41
37
|
};
|
42
|
-
|
43
38
|
case 4:
|
44
39
|
return {
|
45
40
|
wide: '3',
|
@@ -48,7 +43,6 @@ var getLeftTopConfig = function getLeftTopConfig(count, index) {
|
|
48
43
|
leftOffsetDesktop: everySecondWithoutOffset,
|
49
44
|
leftOffsetTablet: everySecondWithoutOffset
|
50
45
|
};
|
51
|
-
|
52
46
|
default:
|
53
47
|
return {
|
54
48
|
wide: '3',
|
@@ -58,14 +52,12 @@ var getLeftTopConfig = function getLeftTopConfig(count, index) {
|
|
58
52
|
leftOffsetTablet: everySecondWithoutOffset
|
59
53
|
};
|
60
54
|
}
|
61
|
-
};
|
62
|
-
|
63
|
-
|
55
|
+
};
|
56
|
+
// center-aligned column with center-aligned icon on top
|
64
57
|
var getCenterTopConfig = function getCenterTopConfig(count, index) {
|
65
58
|
var isEvenIndex = !(index % 2);
|
66
59
|
var everyEvenWithLeftOffset = isEvenIndex ? '1' : undefined;
|
67
60
|
var everyOddWithRightOffset = isEvenIndex ? undefined : '1';
|
68
|
-
|
69
61
|
switch (count) {
|
70
62
|
case 4:
|
71
63
|
return {
|
@@ -77,7 +69,6 @@ var getCenterTopConfig = function getCenterTopConfig(count, index) {
|
|
77
69
|
rightOffsetTablet: everyOddWithRightOffset,
|
78
70
|
rightOffsetDesktop: everyOddWithRightOffset
|
79
71
|
};
|
80
|
-
|
81
72
|
default:
|
82
73
|
return {
|
83
74
|
wide: '4',
|
@@ -86,7 +77,6 @@ var getCenterTopConfig = function getCenterTopConfig(count, index) {
|
|
86
77
|
};
|
87
78
|
}
|
88
79
|
};
|
89
|
-
|
90
80
|
var getOneColumnConfig = function getOneColumnConfig(iconPosition) {
|
91
81
|
return iconPosition !== IconPositionEnum.CENTER_TOP ? {
|
92
82
|
wide: '10',
|
@@ -98,19 +88,15 @@ var getOneColumnConfig = function getOneColumnConfig(iconPosition) {
|
|
98
88
|
tablet: '12'
|
99
89
|
};
|
100
90
|
};
|
101
|
-
|
102
91
|
var getMultiColumnConfig = function getMultiColumnConfig(iconPosition, count, index) {
|
103
92
|
switch (iconPosition) {
|
104
93
|
case IconPositionEnum.LEFT_TOP:
|
105
94
|
return getLeftTopConfig(count, index);
|
106
|
-
|
107
95
|
case IconPositionEnum.CENTER_TOP:
|
108
96
|
return getCenterTopConfig(count, index);
|
109
|
-
|
110
97
|
default:
|
111
98
|
return getLeftSideConfig(count, index);
|
112
99
|
}
|
113
100
|
};
|
114
|
-
|
115
101
|
export default getMultiColumnConfig;
|
116
102
|
export { getLeftSideConfig, getLeftTopConfig, getCenterTopConfig, getOneColumnConfig };
|
@@ -1,38 +1 @@
|
|
1
|
-
h1,
|
2
|
-
h2,
|
3
|
-
h3,
|
4
|
-
h4,
|
5
|
-
h5 {
|
6
|
-
margin: 0;
|
7
|
-
}
|
8
|
-
.mfui-benefits-icons {
|
9
|
-
overflow: hidden;
|
10
|
-
}
|
11
|
-
.mfui-benefits-icons__inner {
|
12
|
-
margin-bottom: -20px;
|
13
|
-
}
|
14
|
-
.mfui-benefits-icons_background_transparent .mfui-benefits-icons__inner {
|
15
|
-
margin-bottom: -48px;
|
16
|
-
}
|
17
|
-
.mfui-benefits-icons__column {
|
18
|
-
margin-bottom: 20px;
|
19
|
-
}
|
20
|
-
.mfui-benefits-icons_background_transparent .mfui-benefits-icons__column {
|
21
|
-
margin-bottom: 48px;
|
22
|
-
}
|
23
|
-
.mfui-benefits-icons_one-column .mfui-benefits-icons__inner {
|
24
|
-
margin-bottom: -24px;
|
25
|
-
}
|
26
|
-
@media screen and (max-width: 767px) {
|
27
|
-
.mfui-benefits-icons_one-column .mfui-benefits-icons__inner {
|
28
|
-
margin-bottom: -32px;
|
29
|
-
}
|
30
|
-
}
|
31
|
-
.mfui-benefits-icons_one-column .mfui-benefits-icons__column {
|
32
|
-
margin-bottom: 24px;
|
33
|
-
}
|
34
|
-
@media screen and (max-width: 767px) {
|
35
|
-
.mfui-benefits-icons_one-column .mfui-benefits-icons__column {
|
36
|
-
margin-bottom: 32px;
|
37
|
-
}
|
38
|
-
}
|
1
|
+
h1,h2,h3,h4,h5{margin:0}.mfui-benefits-icons{overflow:hidden}.mfui-benefits-icons__inner{margin-bottom:-20px}.mfui-benefits-icons_background_transparent .mfui-benefits-icons__inner{margin-bottom:-48px}.mfui-benefits-icons__column{margin-bottom:20px}.mfui-benefits-icons_background_transparent .mfui-benefits-icons__column{margin-bottom:48px}.mfui-benefits-icons_one-column .mfui-benefits-icons__inner{margin-bottom:-24px}@media screen and (max-width:767px){.mfui-benefits-icons_one-column .mfui-benefits-icons__inner{margin-bottom:-32px}}.mfui-benefits-icons_one-column .mfui-benefits-icons__column{margin-bottom:24px}@media screen and (max-width:767px){.mfui-benefits-icons_one-column .mfui-benefits-icons__column{margin-bottom:32px}}
|
@@ -1,90 +1 @@
|
|
1
|
-
h1,
|
2
|
-
h2,
|
3
|
-
h3,
|
4
|
-
h4,
|
5
|
-
h5 {
|
6
|
-
margin: 0;
|
7
|
-
}
|
8
|
-
.mfui-benefits-icons-tile {
|
9
|
-
min-height: 100%;
|
10
|
-
padding: 24px;
|
11
|
-
border-radius: 12px;
|
12
|
-
}
|
13
|
-
.mfui-benefits-icons-tile_background_transparent {
|
14
|
-
padding: 0;
|
15
|
-
}
|
16
|
-
.mfui-benefits-icons-tile_background_gray {
|
17
|
-
background-color: var(--spbSky0);
|
18
|
-
}
|
19
|
-
.mfui-benefits-icons-tile_background_green {
|
20
|
-
background-color: var(--brandGreen20);
|
21
|
-
}
|
22
|
-
.mfui-benefits-icons-tile_background_purple {
|
23
|
-
background-color: var(--brandPurple20);
|
24
|
-
}
|
25
|
-
.mfui-benefits-icons-tile .mfui-benefits-icons-tile__svg-icon {
|
26
|
-
margin-bottom: 10px;
|
27
|
-
}
|
28
|
-
.mfui-benefits-icons-tile__content {
|
29
|
-
font-size: 15px;
|
30
|
-
line-height: 24px;
|
31
|
-
font-weight: 400;
|
32
|
-
}
|
33
|
-
.mfui-benefits-icons-tile__title + .mfui-benefits-icons-tile__content {
|
34
|
-
margin-top: 4px;
|
35
|
-
}
|
36
|
-
.mfui-benefits-icons-tile__text {
|
37
|
-
margin-bottom: 0;
|
38
|
-
}
|
39
|
-
.mfui-benefits-icons-tile__img-icon {
|
40
|
-
width: 64px;
|
41
|
-
height: 64px;
|
42
|
-
border-radius: 8px;
|
43
|
-
}
|
44
|
-
.mfui-benefits-icons-tile__svg-icon {
|
45
|
-
width: 40px;
|
46
|
-
height: 40px;
|
47
|
-
overflow: hidden;
|
48
|
-
}
|
49
|
-
.mfui-benefits-icons-tile__svg-icon svg {
|
50
|
-
fill: var(--brandGreen) !important;
|
51
|
-
}
|
52
|
-
.mfui-benefits-icons-tile_background_purple .mfui-benefits-icons-tile__svg-icon svg {
|
53
|
-
fill: var(--brandPurple) !important;
|
54
|
-
}
|
55
|
-
.mfui-benefits-icons-tile_icon-position_left-side .mfui-benefits-icons-tile__inner {
|
56
|
-
display: -webkit-box;
|
57
|
-
display: -ms-flexbox;
|
58
|
-
display: flex;
|
59
|
-
}
|
60
|
-
.mfui-benefits-icons-tile_icon-position_left-side .mfui-benefits-icons-tile__content-wrapper {
|
61
|
-
padding-top: 8px;
|
62
|
-
}
|
63
|
-
.mfui-benefits-icons-tile_icon-position_left-side .mfui-benefits-icons-tile__svg-icon,
|
64
|
-
.mfui-benefits-icons-tile_icon-position_left-side .mfui-benefits-icons-tile__img-icon {
|
65
|
-
-ms-flex-negative: 0;
|
66
|
-
flex-shrink: 0;
|
67
|
-
margin-right: 14px;
|
68
|
-
margin-bottom: 0;
|
69
|
-
}
|
70
|
-
.mfui-benefits-icons-tile_icon-position_left-side.mfui-benefits-icons-tile_image .mfui-benefits-icons-tile__inner {
|
71
|
-
-webkit-box-align: center;
|
72
|
-
-ms-flex-align: center;
|
73
|
-
align-items: center;
|
74
|
-
}
|
75
|
-
.mfui-benefits-icons-tile_icon-position_left-side.mfui-benefits-icons-tile_image .mfui-benefits-icons-tile__content-wrapper {
|
76
|
-
padding-top: 0;
|
77
|
-
}
|
78
|
-
.mfui-benefits-icons-tile_icon-position_left-side.mfui-benefits-icons-tile_image .mfui-benefits-icons-tile__svg-icon,
|
79
|
-
.mfui-benefits-icons-tile_icon-position_left-side.mfui-benefits-icons-tile_image .mfui-benefits-icons-tile__img-icon {
|
80
|
-
-ms-flex-item-align: start;
|
81
|
-
align-self: start;
|
82
|
-
}
|
83
|
-
.mfui-benefits-icons-tile_icon-position_center-top .mfui-benefits-icons-tile__inner {
|
84
|
-
text-align: center;
|
85
|
-
}
|
86
|
-
.mfui-benefits-icons-tile_icon-position_center-top .mfui-benefits-icons-tile__svg-icon,
|
87
|
-
.mfui-benefits-icons-tile_icon-position_center-top .mfui-benefits-icons-tile__img-icon {
|
88
|
-
margin-right: auto;
|
89
|
-
margin-left: auto;
|
90
|
-
}
|
1
|
+
h1,h2,h3,h4,h5{margin:0}.mfui-benefits-icons-tile{border-radius:12px;min-height:100%;padding:24px}.mfui-benefits-icons-tile_background_transparent{padding:0}.mfui-benefits-icons-tile_background_gray{background-color:var(--spbSky0)}.mfui-benefits-icons-tile_background_green{background-color:var(--brandGreen20)}.mfui-benefits-icons-tile_background_purple{background-color:var(--brandPurple20)}.mfui-benefits-icons-tile .mfui-benefits-icons-tile__svg-icon{margin-bottom:10px}.mfui-benefits-icons-tile__content{font-size:15px;font-weight:400;line-height:24px}.mfui-benefits-icons-tile__title+.mfui-benefits-icons-tile__content{margin-top:4px}.mfui-benefits-icons-tile__text{margin-bottom:0}.mfui-benefits-icons-tile__img-icon{border-radius:8px;height:64px;width:64px}.mfui-benefits-icons-tile__svg-icon{height:40px;overflow:hidden;width:40px}.mfui-benefits-icons-tile__svg-icon svg{fill:var(--brandGreen)!important}.mfui-benefits-icons-tile_background_purple .mfui-benefits-icons-tile__svg-icon svg{fill:var(--brandPurple)!important}.mfui-benefits-icons-tile_icon-position_left-side .mfui-benefits-icons-tile__inner{display:-webkit-box;display:-ms-flexbox;display:flex}.mfui-benefits-icons-tile_icon-position_left-side .mfui-benefits-icons-tile__content-wrapper{padding-top:8px}.mfui-benefits-icons-tile_icon-position_left-side .mfui-benefits-icons-tile__img-icon,.mfui-benefits-icons-tile_icon-position_left-side .mfui-benefits-icons-tile__svg-icon{-ms-flex-negative:0;flex-shrink:0;margin-bottom:0;margin-right:14px}.mfui-benefits-icons-tile_icon-position_left-side.mfui-benefits-icons-tile_image .mfui-benefits-icons-tile__inner{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-benefits-icons-tile_icon-position_left-side.mfui-benefits-icons-tile_image .mfui-benefits-icons-tile__content-wrapper{padding-top:0}.mfui-benefits-icons-tile_icon-position_left-side.mfui-benefits-icons-tile_image .mfui-benefits-icons-tile__img-icon,.mfui-benefits-icons-tile_icon-position_left-side.mfui-benefits-icons-tile_image .mfui-benefits-icons-tile__svg-icon{-ms-flex-item-align:start;align-self:start}.mfui-benefits-icons-tile_icon-position_center-top .mfui-benefits-icons-tile__inner{text-align:center}.mfui-benefits-icons-tile_icon-position_center-top .mfui-benefits-icons-tile__img-icon,.mfui-benefits-icons-tile_icon-position_center-top .mfui-benefits-icons-tile__svg-icon{margin-left:auto;margin-right:auto}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
-
|
2
|
+
type TGridSizeValues = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11' | '12';
|
3
3
|
export interface IBenefit {
|
4
4
|
/** Дополнительные data атрибуты к внутренним элементам */
|
5
5
|
dataAttrs?: {
|
@@ -27,20 +27,20 @@ export declare const IconPositionEnum: {
|
|
27
27
|
readonly CENTER_TOP: "center-top";
|
28
28
|
readonly LEFT_SIDE: "left-side";
|
29
29
|
};
|
30
|
-
export
|
30
|
+
export type IconPosition = (typeof IconPositionEnum)[keyof typeof IconPositionEnum];
|
31
31
|
export declare const ItemsAlignEnum: {
|
32
32
|
readonly LEFT: "left";
|
33
33
|
readonly CENTER: "center";
|
34
34
|
};
|
35
|
-
export
|
35
|
+
export type ItemsAlignType = (typeof ItemsAlignEnum)[keyof typeof ItemsAlignEnum];
|
36
36
|
export declare const BackgroundEnum: {
|
37
37
|
readonly TRANSPARENT: "transparent";
|
38
38
|
readonly GRAY: "gray";
|
39
39
|
readonly GREEN: "green";
|
40
40
|
readonly PURPLE: "purple";
|
41
41
|
};
|
42
|
-
export
|
43
|
-
export
|
42
|
+
export type BackgroundType = (typeof BackgroundEnum)[keyof typeof BackgroundEnum];
|
43
|
+
export type GridConfig = {
|
44
44
|
wide?: TGridSizeValues;
|
45
45
|
desktop?: TGridSizeValues;
|
46
46
|
tablet?: TGridSizeValues;
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import * as React from 'react';
|
2
2
|
import { IBenefit, GridGutterSize } from './types';
|
3
|
-
import './BenfitsPictures.
|
3
|
+
import './BenfitsPictures.scss';
|
4
4
|
export declare const ONLY_LEFT_ALIGN_ITEMS_COUNT = 3;
|
5
5
|
export interface IBenefitsPicturesProps {
|
6
6
|
/** Ссылка на корневой элемент */
|