@megafon/ui-shared 6.0.0-beta.4 → 6.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +4031 -0
- package/dist/es/components/AccordionBox/AccordionBox.css +15 -1
- package/dist/es/components/AccordionBox/AccordionBox.d.ts +2 -2
- package/dist/es/components/AccordionBox/AccordionBox.js +49 -6
- package/dist/es/components/AudioPlayer/AudioPlayer.d.ts +2 -2
- package/dist/es/components/AudioPlayer/AudioPlayer.js +27 -11
- package/dist/es/components/AudioPlayer/AudioProgress.d.ts +1 -1
- package/dist/es/components/AudioPlayer/AudioProgress.js +22 -10
- package/dist/es/components/AudioPlayer/AudioRange.d.ts +1 -1
- package/dist/es/components/AudioPlayer/AudioRange.js +10 -8
- package/dist/es/components/AudioPlayer/AudioVolume.d.ts +1 -1
- package/dist/es/components/AudioPlayer/AudioVolume.js +12 -3
- package/dist/es/components/AudioPlayer/hooks/useTrackDuration.js +10 -4
- package/dist/es/components/AudioPlayer/style/AudioPlayer.css +58 -1
- package/dist/es/components/AudioPlayer/style/AudioProgress.css +35 -1
- package/dist/es/components/AudioPlayer/style/AudioRange.css +68 -1
- package/dist/es/components/AudioPlayer/style/AudioVolume.css +34 -1
- package/dist/es/components/AudioPlayer/timerFormatUtil.js +9 -1
- package/dist/es/components/BannerBox/BannerBox.d.ts +1 -1
- package/dist/es/components/BannerBox/BannerBox.js +12 -3
- package/dist/es/components/BenefitsIcons/BenefitsIcons.d.ts +1 -1
- package/dist/es/components/BenefitsIcons/BenefitsIcons.js +64 -23
- package/dist/es/components/BenefitsIcons/BenefitsIconsTile.d.ts +1 -1
- package/dist/es/components/BenefitsIcons/BenefitsIconsTile.js +36 -9
- package/dist/es/components/BenefitsIcons/helpers.d.ts +3 -3
- package/dist/es/components/BenefitsIcons/helpers.js +20 -6
- package/dist/es/components/BenefitsIcons/style/BenefitsIcons.css +38 -1
- package/dist/es/components/BenefitsIcons/style/BenefitsIconsTile.css +90 -1
- 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 +49 -19
- package/dist/es/components/BenefitsPictures/BenfitsPictures.css +43 -1
- package/dist/es/components/BenefitsPictures/helpers.d.ts +2 -2
- package/dist/es/components/BenefitsPictures/helpers.js +14 -0
- package/dist/es/components/BenefitsPictures/types.d.ts +3 -3
- package/dist/es/components/BenefitsPictures/types.js +0 -1
- package/dist/es/components/Breadcrumbs/Breadcrumbs.css +43 -1
- package/dist/es/components/Breadcrumbs/Breadcrumbs.d.ts +6 -6
- package/dist/es/components/Breadcrumbs/Breadcrumbs.js +39 -10
- package/dist/es/components/Breadcrumbs/components/BreadcrumbsItem.css +16 -1
- package/dist/es/components/Breadcrumbs/components/BreadcrumbsItem.d.ts +4 -4
- package/dist/es/components/Breadcrumbs/components/BreadcrumbsItem.js +36 -11
- package/dist/es/components/ButtonBanner/ButtonBanner.css +122 -1
- package/dist/es/components/ButtonBanner/ButtonBanner.d.ts +7 -7
- package/dist/es/components/ButtonBanner/ButtonBanner.js +53 -22
- package/dist/es/components/ButtonLinkBox/ButtonLinkBox.css +19 -1
- package/dist/es/components/ButtonLinkBox/ButtonLinkBox.d.ts +3 -3
- package/dist/es/components/ButtonLinkBox/ButtonLinkBox.js +51 -20
- package/dist/es/components/Card/Card.css +354 -1
- package/dist/es/components/Card/Card.d.ts +4 -4
- package/dist/es/components/Card/Card.js +115 -25
- package/dist/es/components/Card/types.d.ts +10 -10
- package/dist/es/components/Card/types.js +0 -1
- package/dist/es/components/CardsBox/CardsBox.js +14 -3
- package/dist/es/components/CardsBox/helpers.d.ts +2 -2
- package/dist/es/components/CardsBox/helpers.js +4 -0
- package/dist/es/components/CarouselBox/CarouselBox.d.ts +2 -2
- package/dist/es/components/CarouselBox/CarouselBox.js +24 -11
- package/dist/es/components/Container/Container.css +3287 -1
- package/dist/es/components/Container/Container.d.ts +5 -7
- package/dist/es/components/Container/Container.js +25 -10
- package/dist/es/components/DownloadLinks/DownloadLink.css +37 -1
- package/dist/es/components/DownloadLinks/DownloadLink.d.ts +1 -1
- package/dist/es/components/DownloadLinks/DownloadLink.js +44 -13
- package/dist/es/components/DownloadLinks/DownloadLinks.css +36 -1
- package/dist/es/components/DownloadLinks/DownloadLinks.d.ts +3 -3
- package/dist/es/components/DownloadLinks/DownloadLinks.js +13 -2
- package/dist/es/components/FaqWrapper/FaqWrapper.d.ts +2 -5
- package/dist/es/components/FaqWrapper/FaqWrapper.js +3 -1
- package/dist/es/components/ImageBanner/ImageBanner.css +252 -1
- package/dist/es/components/ImageBanner/ImageBanner.d.ts +7 -8
- package/dist/es/components/ImageBanner/ImageBanner.js +88 -37
- package/dist/es/components/Instructions/Instructions.css +790 -1
- package/dist/es/components/Instructions/Instructions.d.ts +11 -11
- package/dist/es/components/Instructions/Instructions.js +94 -41
- package/dist/es/components/NotificationBox/NotificationBox.d.ts +4 -4
- package/dist/es/components/NotificationBox/NotificationBox.js +19 -5
- package/dist/es/components/NotificationBox/style/NotificationBox.css +28 -0
- package/dist/es/components/PageTitle/PageTitle.css +80 -1
- package/dist/es/components/PageTitle/PageTitle.d.ts +2 -2
- package/dist/es/components/PageTitle/PageTitle.js +37 -12
- package/dist/es/components/Partners/Partners.css +53 -1
- package/dist/es/components/Partners/Partners.d.ts +2 -2
- package/dist/es/components/Partners/Partners.js +48 -17
- package/dist/es/components/PictureWithDescription/PictureWithDescription.css +80 -1
- package/dist/es/components/PictureWithDescription/PictureWithDescription.d.ts +2 -4
- package/dist/es/components/PictureWithDescription/PictureWithDescription.js +28 -10
- package/dist/es/components/Property/Property.css +156 -1
- package/dist/es/components/Property/Property.d.ts +4 -4
- package/dist/es/components/Property/Property.js +81 -37
- package/dist/es/components/Property/PropertyDescription.css +17 -1
- package/dist/es/components/Property/PropertyDescription.d.ts +3 -3
- package/dist/es/components/Property/PropertyDescription.js +28 -8
- package/dist/es/components/Property/types.d.ts +5 -7
- package/dist/es/components/Property/types.js +0 -1
- package/dist/es/components/Steps/Steps.css +41 -1
- package/dist/es/components/Steps/Steps.d.ts +1 -2
- package/dist/es/components/Steps/Steps.js +19 -4
- package/dist/es/components/Steps/StepsItem.css +42 -1
- package/dist/es/components/Steps/StepsItem.d.ts +2 -2
- package/dist/es/components/Steps/StepsItem.js +9 -2
- package/dist/es/components/StoreBanner/StoreBanner.css +346 -1
- package/dist/es/components/StoreBanner/StoreBanner.d.ts +5 -5
- package/dist/es/components/StoreBanner/StoreBanner.js +97 -41
- 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/es/components/StoreButton/StoreButton.css +327 -1
- package/dist/es/components/StoreButton/StoreButton.d.ts +3 -3
- package/dist/es/components/StoreButton/StoreButton.js +44 -13
- package/dist/es/components/Table/Table.css +157 -1
- package/dist/es/components/Table/Table.d.ts +1 -1
- package/dist/es/components/Table/Table.js +51 -31
- package/dist/es/components/Table/TableCell.js +6 -0
- package/dist/es/components/Table/TableRow.js +10 -1
- package/dist/es/components/TabsBox/TabsBox.d.ts +1 -1
- package/dist/es/components/TabsBox/TabsBox.js +13 -4
- package/dist/es/components/TextBox/TextBox.css +25 -1
- package/dist/es/components/TextBox/TextBox.d.ts +1 -2
- package/dist/es/components/TextBox/TextBox.js +23 -8
- package/dist/es/components/TextBox/TextBoxPicture.css +27 -1
- package/dist/es/components/TextBox/TextBoxPicture.d.ts +2 -2
- package/dist/es/components/TextBox/TextBoxPicture.js +14 -5
- package/dist/es/components/TextWithIcon/TextWithIcon.css +10 -1
- package/dist/es/components/TextWithIcon/TextWithIcon.d.ts +1 -1
- package/dist/es/components/TextWithIcon/TextWithIcon.js +24 -6
- package/dist/es/components/TextWithIcon/TextWithIconItem.css +29 -1
- package/dist/es/components/TextWithIcon/TextWithIconItem.d.ts +1 -1
- package/dist/es/components/TextWithIcon/TextWithIconItem.js +21 -6
- package/dist/es/components/TitleDescriptionBox/TitleDescriptionBox.css +31 -1
- package/dist/es/components/TitleDescriptionBox/TitleDescriptionBox.d.ts +1 -1
- package/dist/es/components/TitleDescriptionBox/TitleDescriptionBox.js +23 -6
- package/dist/es/components/VideoBanner/VideoBanner.css +225 -1
- package/dist/es/components/VideoBanner/VideoBanner.d.ts +7 -7
- package/dist/es/components/VideoBanner/VideoBanner.js +110 -47
- package/dist/es/components/VideoBlock/VideoBlock.css +106 -1
- package/dist/es/components/VideoBlock/VideoBlock.d.ts +4 -4
- package/dist/es/components/VideoBlock/VideoBlock.js +75 -35
- package/dist/es/helpers/getColumnConfig.d.ts +1 -5
- package/dist/lib/components/AccordionBox/AccordionBox.css +15 -1
- package/dist/lib/components/AccordionBox/AccordionBox.d.ts +2 -2
- package/dist/lib/components/AccordionBox/AccordionBox.js +66 -10
- package/dist/lib/components/AudioPlayer/AudioPlayer.d.ts +2 -2
- package/dist/lib/components/AudioPlayer/AudioPlayer.js +56 -32
- package/dist/lib/components/AudioPlayer/AudioProgress.d.ts +1 -1
- package/dist/lib/components/AudioPlayer/AudioProgress.js +43 -12
- package/dist/lib/components/AudioPlayer/AudioRange.d.ts +1 -1
- package/dist/lib/components/AudioPlayer/AudioRange.js +17 -9
- package/dist/lib/components/AudioPlayer/AudioVolume.d.ts +1 -1
- package/dist/lib/components/AudioPlayer/AudioVolume.js +23 -4
- package/dist/lib/components/AudioPlayer/hooks/useTrackDuration.js +16 -5
- package/dist/lib/components/AudioPlayer/style/AudioPlayer.css +58 -1
- package/dist/lib/components/AudioPlayer/style/AudioProgress.css +35 -1
- package/dist/lib/components/AudioPlayer/style/AudioRange.css +68 -1
- package/dist/lib/components/AudioPlayer/style/AudioVolume.css +34 -1
- package/dist/lib/components/AudioPlayer/timerFormatUtil.js +13 -2
- package/dist/lib/components/BannerBox/BannerBox.d.ts +1 -1
- package/dist/lib/components/BannerBox/BannerBox.js +25 -7
- package/dist/lib/components/BenefitsIcons/BenefitsIcons.d.ts +1 -1
- package/dist/lib/components/BenefitsIcons/BenefitsIcons.js +86 -26
- package/dist/lib/components/BenefitsIcons/BenefitsIconsTile.d.ts +1 -1
- package/dist/lib/components/BenefitsIcons/BenefitsIconsTile.js +53 -13
- package/dist/lib/components/BenefitsIcons/helpers.d.ts +3 -3
- package/dist/lib/components/BenefitsIcons/helpers.js +37 -10
- package/dist/lib/components/BenefitsIcons/style/BenefitsIcons.css +38 -1
- package/dist/lib/components/BenefitsIcons/style/BenefitsIconsTile.css +90 -1
- package/dist/lib/components/BenefitsIcons/types.d.ts +5 -5
- package/dist/lib/components/BenefitsIcons/types.js +8 -5
- package/dist/lib/components/BenefitsPictures/BenefitsPictures.d.ts +1 -1
- package/dist/lib/components/BenefitsPictures/BenefitsPictures.js +71 -24
- package/dist/lib/components/BenefitsPictures/BenfitsPictures.css +43 -1
- package/dist/lib/components/BenefitsPictures/helpers.d.ts +2 -2
- package/dist/lib/components/BenefitsPictures/helpers.js +40 -9
- package/dist/lib/components/BenefitsPictures/types.d.ts +3 -3
- package/dist/lib/components/BenefitsPictures/types.js +1 -5
- package/dist/lib/components/Breadcrumbs/Breadcrumbs.css +43 -1
- package/dist/lib/components/Breadcrumbs/Breadcrumbs.d.ts +6 -6
- package/dist/lib/components/Breadcrumbs/Breadcrumbs.js +60 -18
- package/dist/lib/components/Breadcrumbs/components/BreadcrumbsItem.css +16 -1
- package/dist/lib/components/Breadcrumbs/components/BreadcrumbsItem.d.ts +4 -4
- package/dist/lib/components/Breadcrumbs/components/BreadcrumbsItem.js +55 -22
- package/dist/lib/components/ButtonBanner/ButtonBanner.css +122 -1
- package/dist/lib/components/ButtonBanner/ButtonBanner.d.ts +7 -7
- package/dist/lib/components/ButtonBanner/ButtonBanner.js +89 -40
- package/dist/lib/components/ButtonLinkBox/ButtonLinkBox.css +19 -1
- package/dist/lib/components/ButtonLinkBox/ButtonLinkBox.d.ts +3 -3
- package/dist/lib/components/ButtonLinkBox/ButtonLinkBox.js +72 -29
- package/dist/lib/components/Card/Card.css +354 -1
- package/dist/lib/components/Card/Card.d.ts +4 -4
- package/dist/lib/components/Card/Card.js +164 -67
- package/dist/lib/components/Card/types.d.ts +10 -10
- package/dist/lib/components/Card/types.js +1 -5
- package/dist/lib/components/CardsBox/CardsBox.js +31 -7
- package/dist/lib/components/CardsBox/helpers.d.ts +2 -2
- package/dist/lib/components/CardsBox/helpers.js +8 -1
- package/dist/lib/components/CarouselBox/CarouselBox.d.ts +2 -2
- package/dist/lib/components/CarouselBox/CarouselBox.js +39 -15
- package/dist/lib/components/Container/Container.css +3287 -1
- package/dist/lib/components/Container/Container.d.ts +5 -7
- package/dist/lib/components/Container/Container.js +40 -18
- package/dist/lib/components/DownloadLinks/DownloadLink.css +37 -1
- package/dist/lib/components/DownloadLinks/DownloadLink.d.ts +1 -1
- package/dist/lib/components/DownloadLinks/DownloadLink.js +60 -17
- package/dist/lib/components/DownloadLinks/DownloadLinks.css +36 -1
- package/dist/lib/components/DownloadLinks/DownloadLinks.d.ts +3 -3
- package/dist/lib/components/DownloadLinks/DownloadLinks.js +33 -8
- package/dist/lib/components/FaqWrapper/FaqWrapper.d.ts +2 -5
- package/dist/lib/components/FaqWrapper/FaqWrapper.js +9 -6
- package/dist/lib/components/ImageBanner/ImageBanner.css +252 -1
- package/dist/lib/components/ImageBanner/ImageBanner.d.ts +7 -8
- package/dist/lib/components/ImageBanner/ImageBanner.js +138 -61
- package/dist/lib/components/Instructions/Instructions.css +790 -1
- package/dist/lib/components/Instructions/Instructions.d.ts +11 -11
- package/dist/lib/components/Instructions/Instructions.js +186 -103
- package/dist/lib/components/NotificationBox/NotificationBox.d.ts +4 -4
- package/dist/lib/components/NotificationBox/NotificationBox.js +37 -9
- package/dist/lib/components/NotificationBox/style/NotificationBox.css +28 -0
- package/dist/lib/components/PageTitle/PageTitle.css +80 -1
- package/dist/lib/components/PageTitle/PageTitle.d.ts +2 -2
- package/dist/lib/components/PageTitle/PageTitle.js +52 -15
- package/dist/lib/components/Partners/Partners.css +53 -1
- package/dist/lib/components/Partners/Partners.d.ts +2 -2
- package/dist/lib/components/Partners/Partners.js +65 -21
- package/dist/lib/components/PictureWithDescription/PictureWithDescription.css +80 -1
- package/dist/lib/components/PictureWithDescription/PictureWithDescription.d.ts +2 -4
- package/dist/lib/components/PictureWithDescription/PictureWithDescription.js +46 -16
- package/dist/lib/components/Property/Property.css +156 -1
- package/dist/lib/components/Property/Property.d.ts +4 -4
- package/dist/lib/components/Property/Property.js +120 -60
- package/dist/lib/components/Property/PropertyDescription.css +17 -1
- package/dist/lib/components/Property/PropertyDescription.d.ts +3 -3
- package/dist/lib/components/Property/PropertyDescription.js +46 -15
- package/dist/lib/components/Property/types.d.ts +5 -7
- package/dist/lib/components/Property/types.js +1 -5
- package/dist/lib/components/Steps/Steps.css +41 -1
- package/dist/lib/components/Steps/Steps.d.ts +1 -2
- package/dist/lib/components/Steps/Steps.js +35 -8
- package/dist/lib/components/Steps/StepsItem.css +42 -1
- package/dist/lib/components/Steps/StepsItem.d.ts +2 -2
- package/dist/lib/components/Steps/StepsItem.js +23 -11
- package/dist/lib/components/StoreBanner/StoreBanner.css +346 -1
- package/dist/lib/components/StoreBanner/StoreBanner.d.ts +5 -5
- package/dist/lib/components/StoreBanner/StoreBanner.js +118 -47
- 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
- package/dist/lib/components/StoreButton/StoreButton.css +327 -1
- package/dist/lib/components/StoreButton/StoreButton.d.ts +3 -3
- package/dist/lib/components/StoreButton/StoreButton.js +63 -17
- package/dist/lib/components/Table/Table.css +157 -1
- package/dist/lib/components/Table/Table.d.ts +1 -1
- package/dist/lib/components/Table/Table.js +68 -35
- package/dist/lib/components/Table/TableCell.js +16 -4
- package/dist/lib/components/Table/TableRow.js +19 -5
- package/dist/lib/components/TabsBox/TabBox.js +4 -1
- package/dist/lib/components/TabsBox/TabsBox.d.ts +1 -1
- package/dist/lib/components/TabsBox/TabsBox.js +26 -8
- package/dist/lib/components/TextBox/TextBox.css +25 -1
- package/dist/lib/components/TextBox/TextBox.d.ts +1 -2
- package/dist/lib/components/TextBox/TextBox.js +36 -12
- package/dist/lib/components/TextBox/TextBoxPicture.css +27 -1
- package/dist/lib/components/TextBox/TextBoxPicture.d.ts +2 -2
- package/dist/lib/components/TextBox/TextBoxPicture.js +29 -11
- package/dist/lib/components/TextWithIcon/TextWithIcon.css +10 -1
- package/dist/lib/components/TextWithIcon/TextWithIcon.d.ts +1 -1
- package/dist/lib/components/TextWithIcon/TextWithIcon.js +39 -10
- package/dist/lib/components/TextWithIcon/TextWithIconItem.css +29 -1
- package/dist/lib/components/TextWithIcon/TextWithIconItem.d.ts +1 -1
- package/dist/lib/components/TextWithIcon/TextWithIconItem.js +37 -10
- package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.css +31 -1
- package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.d.ts +1 -1
- package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.js +40 -10
- package/dist/lib/components/VideoBanner/VideoBanner.css +225 -1
- package/dist/lib/components/VideoBanner/VideoBanner.d.ts +7 -7
- package/dist/lib/components/VideoBanner/VideoBanner.js +176 -83
- package/dist/lib/components/VideoBlock/VideoBlock.css +106 -1
- package/dist/lib/components/VideoBlock/VideoBlock.d.ts +4 -4
- package/dist/lib/components/VideoBlock/VideoBlock.js +114 -58
- package/dist/lib/constants/throttleTime.js +3 -2
- package/dist/lib/helpers/getColumnConfig.d.ts +1 -5
- package/dist/lib/helpers/getColumnConfig.js +5 -2
- package/dist/lib/index.js +57 -10
- package/package.json +92 -87
- package/dist/es/components/NotificationBox/NotificationBox.css +0 -1
- package/dist/lib/components/NotificationBox/NotificationBox.css +0 -1
@@ -1 +1,41 @@
|
|
1
|
-
h1,
|
1
|
+
h1,
|
2
|
+
h2,
|
3
|
+
h3,
|
4
|
+
h4,
|
5
|
+
h5 {
|
6
|
+
margin: 0;
|
7
|
+
}
|
8
|
+
.mfui-steps {
|
9
|
+
width: 66%;
|
10
|
+
margin-right: auto;
|
11
|
+
margin-left: auto;
|
12
|
+
}
|
13
|
+
@media screen and (min-width: 1280px) {
|
14
|
+
.mfui-steps {
|
15
|
+
width: 49%;
|
16
|
+
}
|
17
|
+
}
|
18
|
+
@media screen and (max-width: 767px) {
|
19
|
+
.mfui-steps {
|
20
|
+
width: 100%;
|
21
|
+
}
|
22
|
+
}
|
23
|
+
.mfui-steps__title {
|
24
|
+
margin-bottom: 40px;
|
25
|
+
}
|
26
|
+
.mfui-steps__list {
|
27
|
+
margin: 0;
|
28
|
+
padding: 0;
|
29
|
+
list-style: none;
|
30
|
+
}
|
31
|
+
.mfui-steps__item {
|
32
|
+
margin-bottom: 48px;
|
33
|
+
}
|
34
|
+
@media screen and (max-width: 767px) {
|
35
|
+
.mfui-steps__item {
|
36
|
+
margin-bottom: 24px;
|
37
|
+
}
|
38
|
+
}
|
39
|
+
.mfui-steps__item:last-child {
|
40
|
+
margin-bottom: 0;
|
41
|
+
}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import './Steps.
|
2
|
+
import './Steps.less';
|
3
3
|
export interface ISteps {
|
4
4
|
/** Дополнительный класс корневого элемента */
|
5
5
|
className?: string;
|
@@ -13,7 +13,6 @@ export interface ISteps {
|
|
13
13
|
rootRef?: React.Ref<HTMLDivElement>;
|
14
14
|
/** Заголовок */
|
15
15
|
title?: string;
|
16
|
-
children: React.ReactNode;
|
17
16
|
}
|
18
17
|
declare const Steps: React.FC<ISteps>;
|
19
18
|
export default Steps;
|
@@ -2,14 +2,16 @@ import "core-js/modules/es.array.map.js";
|
|
2
2
|
import * as React from 'react';
|
3
3
|
import { Header } from '@megafon/ui-core';
|
4
4
|
import { cnCreate, convert, titleConvertConfig } from '@megafon/ui-helpers';
|
5
|
+
import PropTypes from 'prop-types';
|
5
6
|
import "./Steps.css";
|
6
7
|
var cn = cnCreate('mfui-steps');
|
8
|
+
|
7
9
|
var Steps = function Steps(_ref) {
|
8
10
|
var className = _ref.className,
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
11
|
+
classes = _ref.classes,
|
12
|
+
title = _ref.title,
|
13
|
+
rootRef = _ref.rootRef,
|
14
|
+
children = _ref.children;
|
13
15
|
return /*#__PURE__*/React.createElement("div", {
|
14
16
|
className: cn([className]),
|
15
17
|
ref: rootRef
|
@@ -25,4 +27,17 @@ var Steps = function Steps(_ref) {
|
|
25
27
|
}, child);
|
26
28
|
})));
|
27
29
|
};
|
30
|
+
|
31
|
+
Steps.propTypes = {
|
32
|
+
className: PropTypes.string,
|
33
|
+
classes: PropTypes.shape({
|
34
|
+
title: PropTypes.string,
|
35
|
+
list: PropTypes.string,
|
36
|
+
item: PropTypes.string
|
37
|
+
}),
|
38
|
+
rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
|
39
|
+
current: PropTypes.elementType
|
40
|
+
}), PropTypes.any])]),
|
41
|
+
title: PropTypes.string
|
42
|
+
};
|
28
43
|
export default Steps;
|
@@ -1 +1,42 @@
|
|
1
|
-
h1,
|
1
|
+
h1,
|
2
|
+
h2,
|
3
|
+
h3,
|
4
|
+
h4,
|
5
|
+
h5 {
|
6
|
+
margin: 0;
|
7
|
+
}
|
8
|
+
.mfui-steps-item {
|
9
|
+
display: -webkit-box;
|
10
|
+
display: -ms-flexbox;
|
11
|
+
display: flex;
|
12
|
+
}
|
13
|
+
.mfui-steps-item__step-number {
|
14
|
+
font-size: 15px;
|
15
|
+
line-height: 24px;
|
16
|
+
font-weight: 500;
|
17
|
+
display: -webkit-box;
|
18
|
+
display: -ms-flexbox;
|
19
|
+
display: flex;
|
20
|
+
-ms-flex-negative: 0;
|
21
|
+
flex-shrink: 0;
|
22
|
+
-webkit-box-align: center;
|
23
|
+
-ms-flex-align: center;
|
24
|
+
align-items: center;
|
25
|
+
-webkit-box-pack: center;
|
26
|
+
-ms-flex-pack: center;
|
27
|
+
justify-content: center;
|
28
|
+
width: 40px;
|
29
|
+
height: 40px;
|
30
|
+
border-radius: 50%;
|
31
|
+
color: var(--stcWhite);
|
32
|
+
background-color: var(--brandGreen);
|
33
|
+
}
|
34
|
+
.mfui-steps-item__text-wrapper {
|
35
|
+
padding-top: 8px;
|
36
|
+
padding-left: 16px;
|
37
|
+
}
|
38
|
+
.mfui-steps-item__nodes {
|
39
|
+
font-size: 15px;
|
40
|
+
line-height: 24px;
|
41
|
+
font-weight: 400;
|
42
|
+
}
|
@@ -1,11 +1,13 @@
|
|
1
|
-
import
|
1
|
+
import React from 'react';
|
2
2
|
import { Paragraph } from '@megafon/ui-core';
|
3
3
|
import { cnCreate, convert, textConvertConfig } from '@megafon/ui-helpers';
|
4
|
+
import PropTypes from 'prop-types';
|
4
5
|
import "./StepsItem.css";
|
5
6
|
var cn = cnCreate('mfui-steps-item');
|
7
|
+
|
6
8
|
var StepsItem = function StepsItem(_ref) {
|
7
9
|
var index = _ref.index,
|
8
|
-
|
10
|
+
text = _ref.text;
|
9
11
|
return /*#__PURE__*/React.createElement("div", {
|
10
12
|
className: cn()
|
11
13
|
}, /*#__PURE__*/React.createElement("span", {
|
@@ -18,4 +20,9 @@ var StepsItem = function StepsItem(_ref) {
|
|
18
20
|
className: cn('nodes')
|
19
21
|
}, text)));
|
20
22
|
};
|
23
|
+
|
24
|
+
StepsItem.propTypes = {
|
25
|
+
index: PropTypes.number.isRequired,
|
26
|
+
text: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.node)]).isRequired
|
27
|
+
};
|
21
28
|
export default StepsItem;
|
@@ -1 +1,346 @@
|
|
1
|
-
h1,
|
1
|
+
h1,
|
2
|
+
h2,
|
3
|
+
h3,
|
4
|
+
h4,
|
5
|
+
h5 {
|
6
|
+
margin: 0;
|
7
|
+
}
|
8
|
+
.mfui-store-banner_theme_default .mfui-store-banner__grid {
|
9
|
+
background-color: var(--base);
|
10
|
+
}
|
11
|
+
.mfui-store-banner_theme_default .mfui-store-banner__content {
|
12
|
+
color: var(--content);
|
13
|
+
}
|
14
|
+
.mfui-store-banner_theme_green .mfui-store-banner__grid {
|
15
|
+
border: 0;
|
16
|
+
background-color: var(--brandGreen);
|
17
|
+
}
|
18
|
+
.mfui-store-banner_theme_green .mfui-store-banner__content {
|
19
|
+
color: var(--stcWhite);
|
20
|
+
}
|
21
|
+
.mfui-store-banner_theme_spbSky1 .mfui-store-banner__grid {
|
22
|
+
border-color: transparent;
|
23
|
+
background-color: var(--spbSky1);
|
24
|
+
}
|
25
|
+
.mfui-store-banner_theme_spbSky1 .mfui-store-banner__content {
|
26
|
+
color: var(--content);
|
27
|
+
}
|
28
|
+
.mfui-store-banner_theme_spbSky0 .mfui-store-banner__grid {
|
29
|
+
border-color: transparent;
|
30
|
+
background-color: var(--spbSky0);
|
31
|
+
}
|
32
|
+
.mfui-store-banner_theme_spbSky0 .mfui-store-banner__content {
|
33
|
+
color: var(--content);
|
34
|
+
}
|
35
|
+
.mfui-store-banner_mask_new-iphone .mfui-store-banner__device-mask {
|
36
|
+
position: relative;
|
37
|
+
z-index: 2;
|
38
|
+
background-image: url('./img/new-iphone.png');
|
39
|
+
}
|
40
|
+
.mfui-store-banner_mask_new-iphone .mfui-store-banner__screen {
|
41
|
+
top: 9px;
|
42
|
+
z-index: 1;
|
43
|
+
width: 90%;
|
44
|
+
border-radius: 14px;
|
45
|
+
}
|
46
|
+
@media screen and (min-width: 768px) and (max-width: 1023px) {
|
47
|
+
.mfui-store-banner_mask_new-iphone .mfui-store-banner__screen {
|
48
|
+
top: 8px;
|
49
|
+
}
|
50
|
+
}
|
51
|
+
@media screen and (max-width: 767px) {
|
52
|
+
.mfui-store-banner_mask_new-iphone .mfui-store-banner__screen {
|
53
|
+
top: 30px;
|
54
|
+
}
|
55
|
+
}
|
56
|
+
.mfui-store-banner_mask_android .mfui-store-banner__device-mask {
|
57
|
+
position: relative;
|
58
|
+
z-index: 2;
|
59
|
+
background-image: url('./img/android.png');
|
60
|
+
}
|
61
|
+
.mfui-store-banner_mask_android .mfui-store-banner__screen {
|
62
|
+
top: 9px;
|
63
|
+
width: 92%;
|
64
|
+
border-radius: 14px;
|
65
|
+
}
|
66
|
+
@media screen and (min-width: 768px) and (max-width: 1023px) {
|
67
|
+
.mfui-store-banner_mask_android .mfui-store-banner__screen {
|
68
|
+
top: 8px;
|
69
|
+
}
|
70
|
+
}
|
71
|
+
@media screen and (max-width: 767px) {
|
72
|
+
.mfui-store-banner_mask_android .mfui-store-banner__screen {
|
73
|
+
top: 30px;
|
74
|
+
}
|
75
|
+
}
|
76
|
+
.mfui-store-banner_mask_white-iphone .mfui-store-banner__device-mask {
|
77
|
+
background-image: url('./img/white-iphone.png');
|
78
|
+
}
|
79
|
+
.mfui-store-banner_mask_black-iphone .mfui-store-banner__device-mask {
|
80
|
+
background-image: url('./img/black-iphone.png');
|
81
|
+
}
|
82
|
+
.mfui-store-banner_mask_white-iphone .mfui-store-banner__screen,
|
83
|
+
.mfui-store-banner_mask_black-iphone .mfui-store-banner__screen {
|
84
|
+
top: 57px;
|
85
|
+
width: 87%;
|
86
|
+
}
|
87
|
+
@media screen and (min-width: 768px) and (max-width: 1023px) {
|
88
|
+
.mfui-store-banner_mask_white-iphone .mfui-store-banner__screen,
|
89
|
+
.mfui-store-banner_mask_black-iphone .mfui-store-banner__screen {
|
90
|
+
top: 47px;
|
91
|
+
}
|
92
|
+
}
|
93
|
+
@media screen and (max-width: 767px) {
|
94
|
+
.mfui-store-banner_mask_white-iphone .mfui-store-banner__screen,
|
95
|
+
.mfui-store-banner_mask_black-iphone .mfui-store-banner__screen {
|
96
|
+
top: 63px;
|
97
|
+
}
|
98
|
+
}
|
99
|
+
.mfui-store-banner_mask_iphone-12 .mfui-store-banner__device-mask {
|
100
|
+
position: relative;
|
101
|
+
z-index: 2;
|
102
|
+
background-image: url('./img/iphone12.png');
|
103
|
+
}
|
104
|
+
.mfui-store-banner_mask_iphone-12 .mfui-store-banner__screen {
|
105
|
+
top: 16px;
|
106
|
+
z-index: 1;
|
107
|
+
width: 87%;
|
108
|
+
border-radius: 4px;
|
109
|
+
}
|
110
|
+
@media screen and (min-width: 1024px) and (max-width: 1279px) {
|
111
|
+
.mfui-store-banner_mask_iphone-12 .mfui-store-banner__screen {
|
112
|
+
top: 17px;
|
113
|
+
}
|
114
|
+
}
|
115
|
+
@media screen and (min-width: 768px) and (max-width: 1023px) {
|
116
|
+
.mfui-store-banner_mask_iphone-12 .mfui-store-banner__screen {
|
117
|
+
top: 13px;
|
118
|
+
}
|
119
|
+
}
|
120
|
+
@media screen and (max-width: 767px) {
|
121
|
+
.mfui-store-banner_mask_iphone-12 .mfui-store-banner__screen {
|
122
|
+
top: 35px;
|
123
|
+
}
|
124
|
+
}
|
125
|
+
@media screen and (max-width: 767px) {
|
126
|
+
.mfui-store-banner_content-left-mobile .mfui-store-banner__content {
|
127
|
+
text-align: left;
|
128
|
+
}
|
129
|
+
}
|
130
|
+
@media screen and (max-width: 767px) {
|
131
|
+
.mfui-store-banner_content-left-mobile .mfui-store-banner__stores {
|
132
|
+
-webkit-box-pack: start;
|
133
|
+
-ms-flex-pack: start;
|
134
|
+
justify-content: flex-start;
|
135
|
+
}
|
136
|
+
}
|
137
|
+
@media screen and (max-width: 767px) {
|
138
|
+
.mfui-store-banner_content-left-mobile .mfui-store-banner__button {
|
139
|
+
margin: 0;
|
140
|
+
}
|
141
|
+
}
|
142
|
+
@media screen and (min-width: 1024px) {
|
143
|
+
.mfui-store-banner__container {
|
144
|
+
padding-top: 30px;
|
145
|
+
}
|
146
|
+
}
|
147
|
+
.mfui-store-banner__grid {
|
148
|
+
padding-top: 32px;
|
149
|
+
padding-bottom: 32px;
|
150
|
+
border: 1px solid var(--spbSky2);
|
151
|
+
border-radius: 24px;
|
152
|
+
}
|
153
|
+
@media screen and (max-width: 767px) {
|
154
|
+
.mfui-store-banner__grid {
|
155
|
+
padding-top: 24px;
|
156
|
+
padding-bottom: 0;
|
157
|
+
}
|
158
|
+
}
|
159
|
+
.mfui-store-banner__content {
|
160
|
+
padding-left: 32px;
|
161
|
+
}
|
162
|
+
@media screen and (min-width: 768px) and (max-width: 1023px) {
|
163
|
+
.mfui-store-banner__content {
|
164
|
+
padding-right: 10px;
|
165
|
+
}
|
166
|
+
}
|
167
|
+
@media screen and (max-width: 767px) {
|
168
|
+
.mfui-store-banner__content {
|
169
|
+
padding-right: 15px;
|
170
|
+
padding-bottom: 32px;
|
171
|
+
padding-left: 15px;
|
172
|
+
text-align: center;
|
173
|
+
}
|
174
|
+
}
|
175
|
+
.mfui-store-banner__device-mask {
|
176
|
+
height: 100%;
|
177
|
+
background-repeat: no-repeat;
|
178
|
+
background-size: cover;
|
179
|
+
}
|
180
|
+
.mfui-store-banner__device-wrapper {
|
181
|
+
position: relative;
|
182
|
+
bottom: calc(2 * (32px - 1px));
|
183
|
+
width: 235px;
|
184
|
+
height: calc(100% + 2 * 32px + 30px);
|
185
|
+
margin-right: auto;
|
186
|
+
margin-left: auto;
|
187
|
+
overflow: hidden;
|
188
|
+
}
|
189
|
+
@media screen and (min-width: 1024px) and (max-width: 1279px) {
|
190
|
+
.mfui-store-banner__device-wrapper {
|
191
|
+
width: 260px;
|
192
|
+
}
|
193
|
+
}
|
194
|
+
@media screen and (max-width: 1023px) {
|
195
|
+
.mfui-store-banner__device-wrapper {
|
196
|
+
bottom: 0;
|
197
|
+
}
|
198
|
+
}
|
199
|
+
@media screen and (min-width: 768px) and (max-width: 1023px) {
|
200
|
+
.mfui-store-banner__device-wrapper {
|
201
|
+
width: 196px;
|
202
|
+
height: calc(100% + 32px);
|
203
|
+
}
|
204
|
+
}
|
205
|
+
@media screen and (max-width: 767px) {
|
206
|
+
.mfui-store-banner__device-wrapper {
|
207
|
+
width: 163px;
|
208
|
+
height: 222px;
|
209
|
+
padding-top: 24px;
|
210
|
+
}
|
211
|
+
}
|
212
|
+
.mfui-store-banner__links {
|
213
|
+
display: -webkit-box;
|
214
|
+
display: -ms-flexbox;
|
215
|
+
display: flex;
|
216
|
+
}
|
217
|
+
.mfui-store-banner__qr-code {
|
218
|
+
-ms-flex-item-align: center;
|
219
|
+
align-self: center;
|
220
|
+
-webkit-box-sizing: border-box;
|
221
|
+
box-sizing: border-box;
|
222
|
+
width: 90px;
|
223
|
+
height: 90px;
|
224
|
+
margin-right: 16px;
|
225
|
+
border: 1px solid var(--spbSky1);
|
226
|
+
border-radius: 8px;
|
227
|
+
background-color: var(--base);
|
228
|
+
}
|
229
|
+
@media screen and (max-width: 767px) {
|
230
|
+
.mfui-store-banner__qr-code {
|
231
|
+
display: none;
|
232
|
+
}
|
233
|
+
}
|
234
|
+
@media screen and (min-width: 768px) {
|
235
|
+
.mfui-store-banner__qr-code + .mfui-store-banner__stores {
|
236
|
+
-webkit-box-orient: vertical;
|
237
|
+
-webkit-box-direction: normal;
|
238
|
+
-ms-flex-direction: column;
|
239
|
+
flex-direction: column;
|
240
|
+
-webkit-box-pack: justify;
|
241
|
+
-ms-flex-pack: justify;
|
242
|
+
justify-content: space-between;
|
243
|
+
}
|
244
|
+
}
|
245
|
+
.mfui-store-banner__store-link {
|
246
|
+
width: 136px;
|
247
|
+
height: 40px;
|
248
|
+
margin-right: 8px;
|
249
|
+
margin-bottom: 10px;
|
250
|
+
margin-left: 8px;
|
251
|
+
}
|
252
|
+
@media screen and (max-width: 767px) {
|
253
|
+
.mfui-store-banner__store-link {
|
254
|
+
width: 119px;
|
255
|
+
height: 35px;
|
256
|
+
}
|
257
|
+
}
|
258
|
+
.mfui-store-banner__store-link:last-child {
|
259
|
+
margin-bottom: 0;
|
260
|
+
}
|
261
|
+
.mfui-store-banner__stores {
|
262
|
+
display: -webkit-box;
|
263
|
+
display: -ms-flexbox;
|
264
|
+
display: flex;
|
265
|
+
-webkit-box-flex: 1;
|
266
|
+
-ms-flex-positive: 1;
|
267
|
+
flex-grow: 1;
|
268
|
+
-ms-flex-wrap: wrap;
|
269
|
+
flex-wrap: wrap;
|
270
|
+
}
|
271
|
+
@media screen and (max-width: 767px) {
|
272
|
+
.mfui-store-banner__stores {
|
273
|
+
-webkit-box-pack: center;
|
274
|
+
-ms-flex-pack: center;
|
275
|
+
justify-content: center;
|
276
|
+
}
|
277
|
+
}
|
278
|
+
@media screen and (min-width: 768px) {
|
279
|
+
.mfui-store-banner__stores {
|
280
|
+
margin-left: -8px;
|
281
|
+
}
|
282
|
+
}
|
283
|
+
.mfui-store-banner__text {
|
284
|
+
margin-bottom: 32px;
|
285
|
+
}
|
286
|
+
.mfui-store-banner__title {
|
287
|
+
margin-bottom: 16px;
|
288
|
+
}
|
289
|
+
.mfui-store-banner__screen {
|
290
|
+
position: absolute;
|
291
|
+
left: 50%;
|
292
|
+
-webkit-transform: translateX(-50%);
|
293
|
+
transform: translateX(-50%);
|
294
|
+
}
|
295
|
+
@media screen and (max-width: 767px) {
|
296
|
+
.mfui-store-banner__button {
|
297
|
+
margin: 0 auto;
|
298
|
+
}
|
299
|
+
}
|
300
|
+
.mfui-store-banner__links_three .mfui-store-banner__qr-code {
|
301
|
+
-o-object-fit: contain;
|
302
|
+
object-fit: contain;
|
303
|
+
}
|
304
|
+
@media screen and (min-width: 1280px) {
|
305
|
+
.mfui-store-banner__links_three .mfui-store-banner__qr-code {
|
306
|
+
max-width: 90px;
|
307
|
+
max-height: 90px;
|
308
|
+
}
|
309
|
+
}
|
310
|
+
.mfui-store-banner__links_three .mfui-store-banner__qr-code + .mfui-store-banner__stores {
|
311
|
+
max-width: 305px;
|
312
|
+
}
|
313
|
+
@media screen and (min-width: 1024px) {
|
314
|
+
.mfui-store-banner__links_three .mfui-store-banner__qr-code + .mfui-store-banner__stores {
|
315
|
+
-webkit-box-orient: horizontal;
|
316
|
+
-webkit-box-direction: normal;
|
317
|
+
-ms-flex-direction: row;
|
318
|
+
flex-direction: row;
|
319
|
+
-webkit-box-pack: start;
|
320
|
+
-ms-flex-pack: start;
|
321
|
+
justify-content: flex-start;
|
322
|
+
}
|
323
|
+
}
|
324
|
+
@media screen and (max-width: 767px) {
|
325
|
+
.mfui-store-banner__links_three .mfui-store-banner__qr-code + .mfui-store-banner__stores {
|
326
|
+
margin: 0 auto;
|
327
|
+
}
|
328
|
+
}
|
329
|
+
.mfui-store-banner__links_three .mfui-store-banner__store-link {
|
330
|
+
width: 136px;
|
331
|
+
height: 40px;
|
332
|
+
}
|
333
|
+
@media screen and (max-width: 1023px) {
|
334
|
+
.mfui-store-banner__links_three .mfui-store-banner__store-link {
|
335
|
+
width: 119px;
|
336
|
+
height: 35px;
|
337
|
+
}
|
338
|
+
}
|
339
|
+
.mfui-store-banner__links_three .mfui-store-banner__store-link:not(:last-child) {
|
340
|
+
margin-bottom: 8px;
|
341
|
+
}
|
342
|
+
@media screen and (max-width: 767px) {
|
343
|
+
.mfui-store-banner__links_three .mfui-store-banner__store-link:not(:last-child) {
|
344
|
+
margin-bottom: 16px;
|
345
|
+
}
|
346
|
+
}
|
@@ -1,13 +1,13 @@
|
|
1
1
|
import * as React from 'react';
|
2
2
|
import { Props as StoreButtonPropsType } from '../StoreButton/StoreButton';
|
3
|
-
import './StoreBanner.
|
3
|
+
import './StoreBanner.less';
|
4
4
|
export declare const Theme: {
|
5
5
|
readonly DEFAULT: "default";
|
6
6
|
readonly GREEN: "green";
|
7
7
|
readonly SPB_SKY_1: "spbSky1";
|
8
8
|
readonly SPB_SKY_0: "spbSky0";
|
9
9
|
};
|
10
|
-
type ThemeType =
|
10
|
+
declare type ThemeType = typeof Theme[keyof typeof Theme];
|
11
11
|
export declare const DeviceMask: {
|
12
12
|
readonly ANDROID: "android";
|
13
13
|
readonly NEW_IPHONE: "new-iphone";
|
@@ -16,9 +16,9 @@ export declare const DeviceMask: {
|
|
16
16
|
readonly WHITE_IPHONE: "white-iphone";
|
17
17
|
readonly IPHONE_12: "iphone-12";
|
18
18
|
};
|
19
|
-
type DeviceMaskType =
|
20
|
-
type LinkHrefType = StoreButtonPropsType['href'];
|
21
|
-
type LinkOnClickType = StoreButtonPropsType['onClick'];
|
19
|
+
declare type DeviceMaskType = typeof DeviceMask[keyof typeof DeviceMask];
|
20
|
+
declare type LinkHrefType = StoreButtonPropsType['href'];
|
21
|
+
declare type LinkOnClickType = StoreButtonPropsType['onClick'];
|
22
22
|
export interface IStoreBannerProps {
|
23
23
|
/** Заголовок */
|
24
24
|
title: string;
|