@megafon/ui-shared 3.0.0-beta.7 → 3.0.2

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 (35) hide show
  1. package/CHANGELOG.md +35 -60
  2. package/README.md +2 -2
  3. package/dist/es/components/AccordionBox/AccordionBox.d.ts +0 -2
  4. package/dist/es/components/AccordionBox/AccordionBox.js +0 -1
  5. package/dist/es/components/Container/Container.css +163 -0
  6. package/dist/es/components/StoreBanner/StoreBanner.css +21 -22
  7. package/dist/es/components/StoreBanner/doc/img/qr-code.png +0 -0
  8. package/dist/es/components/TextBox/TextBox.css +9 -0
  9. package/dist/es/components/TextWithIcon/TextWithIcon.css +15 -0
  10. package/dist/es/components/TextWithIcon/TextWithIcon.d.ts +19 -0
  11. package/dist/es/components/TextWithIcon/TextWithIcon.js +40 -0
  12. package/dist/es/components/TextWithIcon/TextWithIconItem.css +49 -0
  13. package/dist/es/components/TextWithIcon/TextWithIconItem.d.ts +18 -0
  14. package/dist/es/components/TextWithIcon/TextWithIconItem.js +35 -0
  15. package/dist/es/components/VideoBlock/VideoBlock.d.ts +1 -1
  16. package/dist/es/components/VideoBlock/VideoBlock.js +3 -3
  17. package/dist/es/index.d.ts +2 -0
  18. package/dist/es/index.js +2 -0
  19. package/dist/lib/components/AccordionBox/AccordionBox.d.ts +0 -2
  20. package/dist/lib/components/AccordionBox/AccordionBox.js +0 -1
  21. package/dist/lib/components/Container/Container.css +163 -0
  22. package/dist/lib/components/StoreBanner/StoreBanner.css +21 -22
  23. package/dist/lib/components/StoreBanner/doc/img/qr-code.png +0 -0
  24. package/dist/lib/components/TextBox/TextBox.css +9 -0
  25. package/dist/lib/components/TextWithIcon/TextWithIcon.css +15 -0
  26. package/dist/lib/components/TextWithIcon/TextWithIcon.d.ts +19 -0
  27. package/dist/lib/components/TextWithIcon/TextWithIcon.js +60 -0
  28. package/dist/lib/components/TextWithIcon/TextWithIconItem.css +49 -0
  29. package/dist/lib/components/TextWithIcon/TextWithIconItem.d.ts +18 -0
  30. package/dist/lib/components/TextWithIcon/TextWithIconItem.js +54 -0
  31. package/dist/lib/components/VideoBlock/VideoBlock.d.ts +1 -1
  32. package/dist/lib/components/VideoBlock/VideoBlock.js +3 -3
  33. package/dist/lib/index.d.ts +2 -0
  34. package/dist/lib/index.js +16 -0
  35. package/package.json +5 -5
package/CHANGELOG.md CHANGED
@@ -3,112 +3,87 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
- # [3.0.0-beta.7](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@3.0.0-beta.6...@megafon/ui-shared@3.0.0-beta.7) (2022-02-04)
6
+ ## [3.0.2](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@3.0.0...@megafon/ui-shared@3.0.2) (2022-02-11)
7
7
 
8
8
 
9
9
  ### Bug Fixes
10
10
 
11
- * **components:** change tests for dataAttrs prop ([2a8f306](https://github.com/MegafonWebLab/megafon-ui/commit/2a8f3061a4e89f6877894e5947db7bae2827f86a))
11
+ * revert mistake version ([cc8668a](https://github.com/MegafonWebLab/megafon-ui/commit/cc8668a9ff2bc5fde6bf93ca806d4406a5944107))
12
12
 
13
13
 
14
14
 
15
15
 
16
16
 
17
- # [3.0.0-beta.6](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@3.0.0-beta.5...@megafon/ui-shared@3.0.0-beta.6) (2022-02-02)
17
+ # [3.0.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@2.3.0...@megafon/ui-shared@3.0.0) (2022-02-09)
18
18
 
19
19
 
20
20
  ### Bug Fixes
21
21
 
22
- * color props values changes ([b279f2b](https://github.com/MegafonWebLab/megafon-ui/commit/b279f2b5af0edae92fe9825bbfa90a207cb8009a))
23
- * remove deprecated props values ([add76f3](https://github.com/MegafonWebLab/megafon-ui/commit/add76f38a9ebad8b5b6504dfe6aae862746f0dfc))
24
- * **core:** fix build ui-core ([458c824](https://github.com/MegafonWebLab/megafon-ui/commit/458c824aab639e4802db261d0416b3cee58ac274))
25
-
26
-
27
- ### BREAKING CHANGES
28
-
29
- * ContentArea: prop color change values from 'base' to 'white' and from 'content' to 'default';
30
- remove depreacted value 'freshAsphalt'
31
- Paragraph: prop color change values from 'base' to 'white' and from 'contend' to 'default';
32
- remove deprecared values 'freshAsphalt' and 'clearWhite'
33
- StoreBanner: prop theme change value from 'black' to 'default'; remove deprecated value 'clearWhite'
34
- * ContentArea, Paragraph, StoreBanner and Breadcrumbs components from no don't have
35
- freshAsphalt and clearWhite as values for colorize props
36
-
37
-
38
-
39
-
40
-
41
- # [3.0.0-beta.5](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@3.0.0-beta.4...@megafon/ui-shared@3.0.0-beta.5) (2022-01-28)
22
+ * **components:** change tests for dataAttrs prop ([eae8ecb](https://github.com/MegafonWebLab/megafon-ui/commit/eae8ecb5104c050ec0e67357ed5edecdfb042838))
23
+ * color props values changes ([9e3dd31](https://github.com/MegafonWebLab/megafon-ui/commit/9e3dd31a8fd57012482c68c1173aae74028aa3a9))
24
+ * remove deprecated props values ([d09c460](https://github.com/MegafonWebLab/megafon-ui/commit/d09c4606ce6e41f7144e18c2216d039d859288e2))
25
+ * **accordion-box:** change type of onClickAccordion prop ([f464221](https://github.com/MegafonWebLab/megafon-ui/commit/f4642216a3869d7f11005f0162f009225f9661c4))
26
+ * **colors:** renabe green and purple to brandGreen and brandPurple to avoid postcss-colormin bug ([089dd42](https://github.com/MegafonWebLab/megafon-ui/commit/089dd42cd18db7fc83e690da45d09b88c636a6f7))
27
+ * **core:** fix build ui-core ([fa9522a](https://github.com/MegafonWebLab/megafon-ui/commit/fa9522ac0931edb7ec772ad040557997db080687))
42
28
 
43
29
 
44
30
  ### Features
45
31
 
46
- * **header:** made header as a functional component ([81701ad](https://github.com/MegafonWebLab/megafon-ui/commit/81701ad87b6e9df2fe630bf4e183383264c0bb01))
47
-
48
-
49
-
50
-
51
-
52
- # [3.0.0-beta.4](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@3.0.0-beta.3...@megafon/ui-shared@3.0.0-beta.4) (2022-01-27)
53
-
54
- **Note:** Version bump only for package @megafon/ui-shared
55
-
56
-
57
-
58
-
59
-
60
- # [3.0.0-beta.3](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@3.0.0-beta.2...@megafon/ui-shared@3.0.0-beta.3) (2022-01-24)
61
-
62
-
63
- ### Bug Fixes
64
-
65
- * **accordion-box:** change type of onClickAccordion prop ([5d5cef5](https://github.com/MegafonWebLab/megafon-ui/commit/5d5cef5e2dd70efa808a6146e29daf1c882af304))
32
+ * **accordionbox:** remove prop hasVerticalPaddings ([7dfe546](https://github.com/MegafonWebLab/megafon-ui/commit/7dfe546336aa0a94643299309e90fe7e56936e85))
33
+ * **colors:** css custom properties and color themes support ([16df5b7](https://github.com/MegafonWebLab/megafon-ui/commit/16df5b7b2644e15bb6c6e49e7347c0f8e4839e58))
34
+ * **header:** made header as a functional component ([b983934](https://github.com/MegafonWebLab/megafon-ui/commit/b983934ced137ede35f64ce2dfe0c953c1690db0))
35
+ * **textwithicon:** prop items removed, list items are now added by child components ([44ee66c](https://github.com/MegafonWebLab/megafon-ui/commit/44ee66c3964da1111957553c75046407f789e673))
66
36
 
67
37
 
68
38
  ### BREAKING CHANGES
69
39
 
40
+ * **textwithicon:** prop items removed, list items are now added by child components
41
+ * **accordionbox:** remove prop hasVerticalPaddings
70
42
  * **accordion-box:** remove parameter 'title' in onClickAccordion prop
43
+ * **colors:** green, green20, green80, purple, purple20 and purple80 colors now have 'brand'
44
+ prefix (e.g. brandGreen)
45
+ * **contentarea**: prop color change values from 'base' to 'white' and from 'content' to 'default';
46
+ remove depreacted value 'freshAsphalt'
47
+ * **contentarea**, **paragraph**, **storebanner** and **breadcrumbs** components from no don't have
48
+ 'freshAsphalt' and 'clearWhite' as values for colorizing props
49
+ * **storebanner**: prop theme change value from 'black' to 'default'; remove deprecated value 'clearWhite'
50
+ * **components:** for the components to work correctly, now it's needed to import colors.css file
71
51
 
72
52
 
73
53
 
74
54
 
75
-
76
- # [3.0.0-beta.2](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@3.0.0-beta.1...@megafon/ui-shared@3.0.0-beta.2) (2022-01-21)
77
-
78
- **Note:** Version bump only for package @megafon/ui-shared
55
+ # [2.3.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@2.2.1...@megafon/ui-shared@2.3.0) (2022-02-07)
79
56
 
80
57
 
58
+ ### Features
81
59
 
60
+ * **container:** fix margin rules for component TextWithIcon ([3c2de9d](https://github.com/MegafonWebLab/megafon-ui/commit/3c2de9db5a01bdd246daee22dd5545e21dce55ba))
61
+ * **textbox:** add styles for use TextWithIcon inside component ([c993657](https://github.com/MegafonWebLab/megafon-ui/commit/c993657a2f143f87607a7d1474d44c4596d73558))
82
62
 
83
63
 
84
- # [3.0.0-beta.1](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@3.0.0-beta.0...@megafon/ui-shared@3.0.0-beta.1) (2022-01-20)
85
64
 
86
65
 
87
- ### Bug Fixes
88
66
 
89
- * **colors:** renabe green and purple to brandGreen and brandPurple to avoid postcss-colormin bug ([563d97c](https://github.com/MegafonWebLab/megafon-ui/commit/563d97c42900099415a6872f57b500b87aeed647))
67
+ ## [2.2.1](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@2.2.0...@megafon/ui-shared@2.2.1) (2022-01-31)
90
68
 
91
69
 
92
- ### BREAKING CHANGES
70
+ ### Bug Fixes
93
71
 
94
- * **colors:** green, green20, green80, purple, purple20 and purple80 colors now have 'brand'
95
- prefix (e.g. brandGreen)
72
+ * **storebanner:** update qr code image for storebanner examples and fix qr code container styles ([1845222](https://github.com/MegafonWebLab/megafon-ui/commit/1845222e5211e70a8f5aa36ab4a710ecd46e8a14))
96
73
 
97
74
 
98
75
 
99
76
 
100
77
 
101
- # [3.0.0-beta.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@2.1.5...@megafon/ui-shared@3.0.0-beta.0) (2022-01-19)
78
+ # [2.2.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@2.1.5...@megafon/ui-shared@2.2.0) (2022-01-24)
102
79
 
103
80
 
104
81
  ### Features
105
82
 
106
- * **colors:** css custom properties and color themes support ([b19a9a5](https://github.com/MegafonWebLab/megafon-ui/commit/b19a9a5112ebc7427d60f6514d606dd9d71ca444))
107
-
108
-
109
- ### BREAKING CHANGES
110
-
111
- * **colors:** read commit description
83
+ * **accordionbox:** props hasVerticalPaddings marked as deprecated ([7dbb43b](https://github.com/MegafonWebLab/megafon-ui/commit/7dbb43b1178f4055ecd0f4eed5614024da638091))
84
+ * **container:** add rules for TextWithIcon component ([4c692ab](https://github.com/MegafonWebLab/megafon-ui/commit/4c692ab43db115dc7c5aeba39713d6f2ae2daaff))
85
+ * **textwithicon:** add component TextWithIcon ([b772728](https://github.com/MegafonWebLab/megafon-ui/commit/b772728b8739dbbfa550eef1c8eedb56cda620c9))
86
+ * **videoblock:** made button optional ([eef7c17](https://github.com/MegafonWebLab/megafon-ui/commit/eef7c174415b28fe3512d8c28fcd9bb73774dd2e))
112
87
 
113
88
 
114
89
 
package/README.md CHANGED
@@ -5,10 +5,10 @@ React UI components library.
5
5
  ## Getting started
6
6
 
7
7
  ```bash
8
- $ npm install --save @megafon/ui-shared@beta
8
+ $ npm install --save @megafon/ui-shared
9
9
  ```
10
10
  ```bash
11
- $ yarn add @megafon/ui-shared@beta
11
+ $ yarn add @megafon/ui-shared
12
12
  ```
13
13
 
14
14
  ## Development notes
@@ -15,8 +15,6 @@ export interface IAccordionBox {
15
15
  isFullWidth?: boolean;
16
16
  /** Центрирование по горизонтали для расширения 1280+ */
17
17
  hCenterAlignWide?: boolean;
18
- /** Вертикальные отступы */
19
- hasVerticalPaddings?: boolean;
20
18
  /** Дополнительный класс для корнеовго элемента */
21
19
  className?: string;
22
20
  /** Дополнительные классы для корневого и внутренних элементов */
@@ -51,7 +51,6 @@ AccordionBox.propTypes = {
51
51
  isFullWidth: PropTypes.bool,
52
52
  isOpened: PropTypes.bool,
53
53
  hCenterAlignWide: PropTypes.bool,
54
- hasVerticalPaddings: PropTypes.bool,
55
54
  className: PropTypes.string,
56
55
  classes: PropTypes.shape({
57
56
  openedClass: PropTypes.string,
@@ -344,6 +344,9 @@ h5 {
344
344
  .mfui-container .mfui-title-description-box + .mfui-download-links {
345
345
  margin-top: 32px;
346
346
  }
347
+ .mfui-container .mfui-title-description-box + .mfui-text-with-icon {
348
+ margin-top: 24px;
349
+ }
347
350
  @media screen and (min-width: 768px) and (max-width: 1023px) {
348
351
  .mfui-container .mfui-title-description-box + .mfui-benefits-icons {
349
352
  margin-top: 48px;
@@ -2230,6 +2233,9 @@ h5 {
2230
2233
  .mfui-container .mfui-text-box + .mfui-download-links {
2231
2234
  margin-top: 32px;
2232
2235
  }
2236
+ .mfui-container .mfui-text-box + .mfui-text-with-icon {
2237
+ margin-top: 32px;
2238
+ }
2233
2239
  @media screen and (min-width: 768px) and (max-width: 1023px) {
2234
2240
  .mfui-container .mfui-text-box + .mfui-benefits-icons {
2235
2241
  margin-top: 48px;
@@ -2869,6 +2875,163 @@ h5 {
2869
2875
  .mfui-container .mfui-page-title + .mfui-button-link-box {
2870
2876
  margin-top: 0 !important;
2871
2877
  }
2878
+ .mfui-container .mfui-text-with-icon + .mfui-benefits-pictures {
2879
+ margin-top: 40px;
2880
+ }
2881
+ .mfui-container .mfui-text-with-icon + .mfui-cards-box {
2882
+ margin-top: 40px;
2883
+ }
2884
+ .mfui-container .mfui-text-with-icon + .mfui-carousel-box {
2885
+ margin-top: 40px;
2886
+ }
2887
+ .mfui-container .mfui-text-with-icon + .mfui-video-block {
2888
+ margin-top: 40px;
2889
+ }
2890
+ .mfui-container .mfui-text-with-icon + .mfui-tabs-box {
2891
+ margin-top: 40px;
2892
+ }
2893
+ .mfui-container .mfui-text-with-icon + .mfui-partners {
2894
+ margin-top: 40px;
2895
+ }
2896
+ .mfui-container .mfui-text-with-icon + .mfui-instructions {
2897
+ margin-top: 40px;
2898
+ }
2899
+ .mfui-container .mfui-text-with-icon + .mfui-property {
2900
+ margin-top: 40px;
2901
+ }
2902
+ .mfui-container .mfui-text-with-icon + .mfui-table {
2903
+ margin-top: 40px;
2904
+ }
2905
+ .mfui-container .mfui-text-with-icon + .mfui-accordion-box {
2906
+ margin-top: 40px;
2907
+ }
2908
+ .mfui-container .mfui-text-with-icon + .mfui-button-link-box {
2909
+ margin-top: 40px;
2910
+ }
2911
+ .mfui-container .mfui-text-with-icon + .mfui-download-links {
2912
+ margin-top: 40px;
2913
+ }
2914
+ .mfui-container .mfui-text-with-icon + .mfui-text-box {
2915
+ margin-top: 32px;
2916
+ }
2917
+ .mfui-container .mfui-text-with-icon + .mfui-picture-with-description {
2918
+ margin-top: 40px;
2919
+ }
2920
+ .mfui-container .mfui-text-with-icon + .mfui-store-banner {
2921
+ margin-top: 40px;
2922
+ }
2923
+ .mfui-container .mfui-text-with-icon + .mfui-button-banner {
2924
+ margin-top: 40px;
2925
+ }
2926
+ .mfui-container .mfui-text-with-icon + .mfui-steps {
2927
+ margin-top: 40px;
2928
+ }
2929
+ @media screen and (min-width: 768px) and (max-width: 1023px) {
2930
+ .mfui-container .mfui-text-with-icon + .mfui-benefits-pictures {
2931
+ margin-top: 48px;
2932
+ }
2933
+ .mfui-container .mfui-text-with-icon + .mfui-cards-box {
2934
+ margin-top: 48px;
2935
+ }
2936
+ .mfui-container .mfui-text-with-icon + .mfui-carousel-box {
2937
+ margin-top: 48px;
2938
+ }
2939
+ .mfui-container .mfui-text-with-icon + .mfui-video-block {
2940
+ margin-top: 48px;
2941
+ }
2942
+ .mfui-container .mfui-text-with-icon + .mfui-tabs-box {
2943
+ margin-top: 48px;
2944
+ }
2945
+ .mfui-container .mfui-text-with-icon + .mfui-partners {
2946
+ margin-top: 48px;
2947
+ }
2948
+ .mfui-container .mfui-text-with-icon + .mfui-instructions {
2949
+ margin-top: 48px;
2950
+ }
2951
+ .mfui-container .mfui-text-with-icon + .mfui-property {
2952
+ margin-top: 48px;
2953
+ }
2954
+ .mfui-container .mfui-text-with-icon + .mfui-table {
2955
+ margin-top: 48px;
2956
+ }
2957
+ .mfui-container .mfui-text-with-icon + .mfui-accordion-box {
2958
+ margin-top: 48px;
2959
+ }
2960
+ .mfui-container .mfui-text-with-icon + .mfui-button-link-box {
2961
+ margin-top: 48px;
2962
+ }
2963
+ .mfui-container .mfui-text-with-icon + .mfui-download-links {
2964
+ margin-top: 48px;
2965
+ }
2966
+ .mfui-container .mfui-text-with-icon + .mfui-text-box {
2967
+ margin-top: 32px;
2968
+ }
2969
+ .mfui-container .mfui-text-with-icon + .mfui-picture-with-description {
2970
+ margin-top: 48px;
2971
+ }
2972
+ .mfui-container .mfui-text-with-icon + .mfui-store-banner {
2973
+ margin-top: 48px;
2974
+ }
2975
+ .mfui-container .mfui-text-with-icon + .mfui-button-banner {
2976
+ margin-top: 48px;
2977
+ }
2978
+ .mfui-container .mfui-text-with-icon + .mfui-steps {
2979
+ margin-top: 48px;
2980
+ }
2981
+ }
2982
+ @media screen and (min-width: 1024px) {
2983
+ .mfui-container .mfui-text-with-icon + .mfui-benefits-pictures {
2984
+ margin-top: 56px;
2985
+ }
2986
+ .mfui-container .mfui-text-with-icon + .mfui-cards-box {
2987
+ margin-top: 56px;
2988
+ }
2989
+ .mfui-container .mfui-text-with-icon + .mfui-carousel-box {
2990
+ margin-top: 56px;
2991
+ }
2992
+ .mfui-container .mfui-text-with-icon + .mfui-video-block {
2993
+ margin-top: 56px;
2994
+ }
2995
+ .mfui-container .mfui-text-with-icon + .mfui-tabs-box {
2996
+ margin-top: 56px;
2997
+ }
2998
+ .mfui-container .mfui-text-with-icon + .mfui-partners {
2999
+ margin-top: 56px;
3000
+ }
3001
+ .mfui-container .mfui-text-with-icon + .mfui-instructions {
3002
+ margin-top: 56px;
3003
+ }
3004
+ .mfui-container .mfui-text-with-icon + .mfui-property {
3005
+ margin-top: 56px;
3006
+ }
3007
+ .mfui-container .mfui-text-with-icon + .mfui-table {
3008
+ margin-top: 56px;
3009
+ }
3010
+ .mfui-container .mfui-text-with-icon + .mfui-accordion-box {
3011
+ margin-top: 56px;
3012
+ }
3013
+ .mfui-container .mfui-text-with-icon + .mfui-button-link-box {
3014
+ margin-top: 48px;
3015
+ }
3016
+ .mfui-container .mfui-text-with-icon + .mfui-download-links {
3017
+ margin-top: 48px;
3018
+ }
3019
+ .mfui-container .mfui-text-with-icon + .mfui-text-box {
3020
+ margin-top: 32px;
3021
+ }
3022
+ .mfui-container .mfui-text-with-icon + .mfui-picture-with-description {
3023
+ margin-top: 56px;
3024
+ }
3025
+ .mfui-container .mfui-text-with-icon + .mfui-store-banner {
3026
+ margin-top: 56px;
3027
+ }
3028
+ .mfui-container .mfui-text-with-icon + .mfui-button-banner {
3029
+ margin-top: 56px;
3030
+ }
3031
+ .mfui-container .mfui-text-with-icon + .mfui-steps {
3032
+ margin-top: 56px;
3033
+ }
3034
+ }
2872
3035
  .mfui-container_disable-padding-top {
2873
3036
  padding-top: 0 !important;
2874
3037
  }
@@ -159,7 +159,16 @@ h5 {
159
159
  display: flex;
160
160
  }
161
161
  .mfui-store-banner__qr-code {
162
+ -ms-flex-item-align: center;
163
+ align-self: center;
164
+ -webkit-box-sizing: border-box;
165
+ box-sizing: border-box;
166
+ width: 90px;
167
+ height: 90px;
162
168
  margin-right: 16px;
169
+ border: 1px solid var(--spbSky1);
170
+ border-radius: 8px;
171
+ background-color: var(--base);
163
172
  }
164
173
  @media screen and (max-width: 767px) {
165
174
  .mfui-store-banner__qr-code {
@@ -180,6 +189,9 @@ h5 {
180
189
  .mfui-store-banner__store-link {
181
190
  width: 136px;
182
191
  height: 40px;
192
+ margin-right: 8px;
193
+ margin-bottom: 10px;
194
+ margin-left: 8px;
183
195
  }
184
196
  @media screen and (max-width: 767px) {
185
197
  .mfui-store-banner__store-link {
@@ -187,9 +199,8 @@ h5 {
187
199
  height: 35px;
188
200
  }
189
201
  }
190
- .mfui-store-banner__store-link:not(:last-child) {
191
- margin-right: 16px;
192
- margin-bottom: 10px;
202
+ .mfui-store-banner__store-link:last-child {
203
+ margin-bottom: 0;
193
204
  }
194
205
  .mfui-store-banner__stores {
195
206
  display: -webkit-box;
@@ -208,6 +219,11 @@ h5 {
208
219
  justify-content: center;
209
220
  }
210
221
  }
222
+ @media screen and (min-width: 768px) {
223
+ .mfui-store-banner__stores {
224
+ margin-left: -8px;
225
+ }
226
+ }
211
227
  .mfui-store-banner__text {
212
228
  margin-bottom: 32px;
213
229
  }
@@ -229,16 +245,10 @@ h5 {
229
245
  -o-object-fit: contain;
230
246
  object-fit: contain;
231
247
  }
232
- @media screen and (min-width: 768px) and (max-width: 1023px) {
233
- .mfui-store-banner__links_three .mfui-store-banner__qr-code {
234
- width: 120px;
235
- height: 120px;
236
- }
237
- }
238
248
  @media screen and (min-width: 1280px) {
239
249
  .mfui-store-banner__links_three .mfui-store-banner__qr-code {
240
- max-width: 88px;
241
- max-height: 88px;
250
+ max-width: 90px;
251
+ max-height: 90px;
242
252
  }
243
253
  }
244
254
  .mfui-store-banner__links_three .mfui-store-banner__qr-code + .mfui-store-banner__stores {
@@ -260,12 +270,6 @@ h5 {
260
270
  margin: 0 auto;
261
271
  }
262
272
  }
263
- .mfui-store-banner__links_three .mfui-store-banner__qr-code + .mfui-store-banner__stores .mfui-store-banner__store-link {
264
- margin-right: 16px;
265
- }
266
- .mfui-store-banner__links_three .mfui-store-banner__qr-code + .mfui-store-banner__stores .mfui-store-banner__store-link:not(:first-child) {
267
- margin-right: 0;
268
- }
269
273
  .mfui-store-banner__links_three .mfui-store-banner__store-link {
270
274
  width: 136px;
271
275
  height: 40px;
@@ -284,8 +288,3 @@ h5 {
284
288
  margin-bottom: 16px;
285
289
  }
286
290
  }
287
- @media screen and (max-width: 1023px) {
288
- .mfui-store-banner__links_three .mfui-store-banner__store-link:not(:first-child) {
289
- margin-right: 0;
290
- }
291
- }
@@ -14,3 +14,12 @@ h5 {
14
14
  .mfui-text-box_text-center {
15
15
  text-align: center;
16
16
  }
17
+ .mfui-text-box .mfui-text-with-icon {
18
+ margin: 24px 0;
19
+ }
20
+ .mfui-text-box .mfui-text-with-icon + .mfui-header {
21
+ margin-top: 32px;
22
+ }
23
+ .mfui-text-box .mfui-text-box-picture + .mfui-text-with-icon {
24
+ margin: 32px 0 24px;
25
+ }
@@ -0,0 +1,15 @@
1
+ h1,
2
+ h2,
3
+ h3,
4
+ h4,
5
+ h5 {
6
+ margin: 0;
7
+ }
8
+ .mfui-text-with-icon__header {
9
+ margin-bottom: 24px;
10
+ }
11
+ @media screen and (max-width: 767px) {
12
+ .mfui-text-with-icon__header {
13
+ text-align: center;
14
+ }
15
+ }
@@ -0,0 +1,19 @@
1
+ import * as React from 'react';
2
+ import { ITextWithIconItem } from './TextWithIconItem';
3
+ import './TextWithIcon.less';
4
+ export interface ITextWithIconProps {
5
+ /** Заголовок */
6
+ title?: string;
7
+ /** Ссылка на корневой элемент */
8
+ rootRef?: React.Ref<HTMLDivElement>;
9
+ /** Дополнительные data атрибуты к внутренним элементам */
10
+ dataAttrs?: {
11
+ root?: Record<string, string>;
12
+ };
13
+ /** Дополнительный класс для корневого элемента */
14
+ className?: string;
15
+ /** Допустимый дочерний компонент */
16
+ children: React.ReactElement<ITextWithIconItem>[] | React.ReactElement<ITextWithIconItem>;
17
+ }
18
+ declare const TextWithIcon: React.FC<ITextWithIconProps>;
19
+ export default TextWithIcon;
@@ -0,0 +1,40 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import * as React from 'react';
3
+ import { Header, Grid, GridColumn } from '@megafon/ui-core';
4
+ import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
5
+ import * as PropTypes from 'prop-types';
6
+ import "./TextWithIcon.css";
7
+ var cn = cnCreate('mfui-text-with-icon');
8
+
9
+ var TextWithIcon = function TextWithIcon(_ref) {
10
+ var title = _ref.title,
11
+ rootRef = _ref.rootRef,
12
+ dataAttrs = _ref.dataAttrs,
13
+ className = _ref.className,
14
+ children = _ref.children;
15
+ return /*#__PURE__*/React.createElement("div", _extends({
16
+ className: cn([className]),
17
+ ref: rootRef
18
+ }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(GridColumn, {
19
+ mobile: '12',
20
+ tablet: '7',
21
+ desktop: '6',
22
+ wide: '6'
23
+ }, title && /*#__PURE__*/React.createElement(Header, {
24
+ className: cn('header'),
25
+ as: "h5"
26
+ }, title), children)));
27
+ };
28
+
29
+ TextWithIcon.propTypes = {
30
+ title: PropTypes.string,
31
+ rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
32
+ current: PropTypes.elementType
33
+ }), PropTypes.any])]),
34
+ dataAttrs: PropTypes.shape({
35
+ root: PropTypes.objectOf(PropTypes.string.isRequired)
36
+ }),
37
+ children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.element.isRequired), PropTypes.element.isRequired]).isRequired,
38
+ className: PropTypes.string
39
+ };
40
+ export default TextWithIcon;
@@ -0,0 +1,49 @@
1
+ h1,
2
+ h2,
3
+ h3,
4
+ h4,
5
+ h5 {
6
+ margin: 0;
7
+ }
8
+ .mfui-text-with-icon-item {
9
+ display: -webkit-box;
10
+ display: -ms-flexbox;
11
+ display: flex;
12
+ -webkit-box-align: center;
13
+ -ms-flex-align: center;
14
+ align-items: center;
15
+ }
16
+ @media screen and (max-width: 767px) {
17
+ .mfui-text-with-icon-item {
18
+ -webkit-box-orient: vertical;
19
+ -webkit-box-direction: normal;
20
+ -ms-flex-direction: column;
21
+ flex-direction: column;
22
+ }
23
+ }
24
+ .mfui-text-with-icon-item:not(:first-of-type) {
25
+ margin-top: 16px;
26
+ }
27
+ @media screen and (max-width: 767px) {
28
+ .mfui-text-with-icon-item:not(:first-of-type) {
29
+ margin-top: 24px;
30
+ }
31
+ }
32
+ .mfui-text-with-icon-item__svg-icon {
33
+ width: 40px;
34
+ min-width: 40px;
35
+ height: 40px;
36
+ min-height: 40px;
37
+ overflow: hidden;
38
+ }
39
+ @media screen and (min-width: 768px) {
40
+ .mfui-text-with-icon-item__svg-icon {
41
+ margin-right: 16px;
42
+ }
43
+ }
44
+ @media screen and (max-width: 767px) {
45
+ .mfui-text-with-icon-item__text {
46
+ margin-top: 12px;
47
+ text-align: center;
48
+ }
49
+ }
@@ -0,0 +1,18 @@
1
+ import * as React from 'react';
2
+ import './TextWithIconItem.less';
3
+ export interface ITextWithIconItem {
4
+ /** Текст */
5
+ text: string;
6
+ /** Иконка */
7
+ icon: React.ReactNode;
8
+ /** Ссылка на корневой элемент */
9
+ rootRef?: React.Ref<HTMLDivElement>;
10
+ /** Дополнительные data атрибуты к внутренним элементам */
11
+ dataAttrs?: {
12
+ root?: Record<string, string>;
13
+ };
14
+ /** Дополнительный класс для корневого элемента */
15
+ className?: string;
16
+ }
17
+ declare const TextWithIconItem: React.FC<ITextWithIconItem>;
18
+ export default TextWithIconItem;
@@ -0,0 +1,35 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import * as React from 'react';
3
+ import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
4
+ import * as PropTypes from 'prop-types';
5
+ import "./TextWithIconItem.css";
6
+ var cn = cnCreate('mfui-text-with-icon-item');
7
+
8
+ var TextWithIconItem = function TextWithIconItem(_ref) {
9
+ var text = _ref.text,
10
+ icon = _ref.icon,
11
+ rootRef = _ref.rootRef,
12
+ dataAttrs = _ref.dataAttrs,
13
+ className = _ref.className;
14
+ return /*#__PURE__*/React.createElement("div", _extends({
15
+ className: cn([className]),
16
+ ref: rootRef
17
+ }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement("div", {
18
+ className: cn('svg-icon')
19
+ }, icon), /*#__PURE__*/React.createElement("div", {
20
+ className: cn('text')
21
+ }, text));
22
+ };
23
+
24
+ TextWithIconItem.propTypes = {
25
+ text: PropTypes.string.isRequired,
26
+ icon: PropTypes.node.isRequired,
27
+ rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
28
+ current: PropTypes.elementType
29
+ }), PropTypes.any])]),
30
+ dataAttrs: PropTypes.shape({
31
+ root: PropTypes.objectOf(PropTypes.string.isRequired)
32
+ }),
33
+ className: PropTypes.string
34
+ };
35
+ export default TextWithIconItem;
@@ -6,7 +6,7 @@ export interface IContent {
6
6
  /** Текст-описание */
7
7
  description: string | React.ReactNode[] | React.ReactNode;
8
8
  /** Текст кнопки */
9
- buttonTitle: string;
9
+ buttonTitle?: string;
10
10
  /** Добавляет атрибут download для тега <a> компонента Button */
11
11
  buttonDownload?: boolean;
12
12
  /** Ссылка на кнопке */