@megafon/ui-shared 2.0.1 → 2.1.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 CHANGED
@@ -3,6 +3,17 @@
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
+ # [2.1.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@2.0.1...@megafon/ui-shared@2.1.0) (2021-12-13)
7
+
8
+
9
+ ### Features
10
+
11
+ * **container:** add new indents to child components ([9469e71](https://github.com/MegafonWebLab/megafon-ui/commit/9469e71946371813c0e946f0a71a2b3876f386eb))
12
+
13
+
14
+
15
+
16
+
6
17
  ## [2.0.1](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@2.0.0...@megafon/ui-shared@2.0.1) (2021-12-07)
7
18
 
8
19
  **Note:** Version bump only for package @megafon/ui-shared
@@ -1325,10 +1325,8 @@ h5 {
1325
1325
  .mfui-container .mfui-tabs-box + .mfui-button-link-box {
1326
1326
  margin-top: 48px;
1327
1327
  }
1328
- @media screen and (max-width: 767px) {
1329
- .mfui-container .mfui-tabs-box + .mfui-button-link-box {
1330
- margin-top: 32px;
1331
- }
1328
+ .mfui-container .mfui-tabs-box + .mfui-download-links {
1329
+ margin-top: 48px;
1332
1330
  }
1333
1331
  .mfui-container .mfui-tabs-box + .mfui-text-box {
1334
1332
  margin-top: 56px;
@@ -1339,6 +1337,12 @@ h5 {
1339
1337
  }
1340
1338
  }
1341
1339
  @media screen and (max-width: 767px) {
1340
+ .mfui-container .mfui-tabs-box + .mfui-button-link-box {
1341
+ margin-top: 32px;
1342
+ }
1343
+ .mfui-container .mfui-tabs-box + .mfui-download-links {
1344
+ margin-top: 40px;
1345
+ }
1342
1346
  .mfui-container .mfui-tabs-box + .mfui-text-box {
1343
1347
  margin-top: 40px;
1344
1348
  }
@@ -1438,9 +1442,6 @@ h5 {
1438
1442
  .mfui-container .mfui-tabs-box .mfui-tabs-box {
1439
1443
  margin-top: 0 !important;
1440
1444
  }
1441
- .mfui-container .mfui-partners + .mfui-button-link-box {
1442
- margin-top: 48px;
1443
- }
1444
1445
  .mfui-container .mfui-partners + .mfui-benefits-icons {
1445
1446
  margin-top: 56px;
1446
1447
  }
@@ -1459,9 +1460,6 @@ h5 {
1459
1460
  .mfui-container .mfui-partners + .mfui-tabs-box {
1460
1461
  margin-top: 56px;
1461
1462
  }
1462
- .mfui-container .mfui-partners + .mfui-partners {
1463
- margin-top: 56px;
1464
- }
1465
1463
  .mfui-container .mfui-partners + .mfui-instructions {
1466
1464
  margin-top: 56px;
1467
1465
  }
@@ -1475,10 +1473,10 @@ h5 {
1475
1473
  margin-top: 56px;
1476
1474
  }
1477
1475
  .mfui-container .mfui-partners + .mfui-button-link-box {
1478
- margin-top: 56px;
1476
+ margin-top: 48px;
1479
1477
  }
1480
1478
  .mfui-container .mfui-partners + .mfui-download-links {
1481
- margin-top: 56px;
1479
+ margin-top: 32px;
1482
1480
  }
1483
1481
  .mfui-container .mfui-partners + .mfui-text-box {
1484
1482
  margin-top: 56px;
@@ -1514,9 +1512,6 @@ h5 {
1514
1512
  .mfui-container .mfui-partners + .mfui-tabs-box {
1515
1513
  margin-top: 48px;
1516
1514
  }
1517
- .mfui-container .mfui-partners + .mfui-partners {
1518
- margin-top: 48px;
1519
- }
1520
1515
  .mfui-container .mfui-partners + .mfui-instructions {
1521
1516
  margin-top: 48px;
1522
1517
  }
@@ -1570,9 +1565,6 @@ h5 {
1570
1565
  .mfui-container .mfui-partners + .mfui-tabs-box {
1571
1566
  margin-top: 40px;
1572
1567
  }
1573
- .mfui-container .mfui-partners + .mfui-partners {
1574
- margin-top: 40px;
1575
- }
1576
1568
  .mfui-container .mfui-partners + .mfui-instructions {
1577
1569
  margin-top: 40px;
1578
1570
  }
@@ -1607,10 +1599,6 @@ h5 {
1607
1599
  margin-top: 40px;
1608
1600
  }
1609
1601
  }
1610
- .mfui-container .mfui-partners + .mfui-partners,
1611
- .mfui-container .mfui-partners + .mfui-download-links {
1612
- margin-top: 0 !important;
1613
- }
1614
1602
  .mfui-container .mfui-instructions + .mfui-benefits-icons {
1615
1603
  margin-top: 56px;
1616
1604
  }
@@ -1644,11 +1632,8 @@ h5 {
1644
1632
  .mfui-container .mfui-instructions + .mfui-accordion-box {
1645
1633
  margin-top: 56px;
1646
1634
  }
1647
- .mfui-container .mfui-instructions + .mfui-button-link-box {
1648
- margin-top: 56px;
1649
- }
1650
1635
  .mfui-container .mfui-instructions + .mfui-download-links {
1651
- margin-top: 56px;
1636
+ margin-top: 32px;
1652
1637
  }
1653
1638
  .mfui-container .mfui-instructions + .mfui-text-box {
1654
1639
  margin-top: 56px;
@@ -1665,7 +1650,7 @@ h5 {
1665
1650
  .mfui-container .mfui-instructions + .mfui-steps {
1666
1651
  margin-top: 56px;
1667
1652
  }
1668
- @media screen and (max-width: 1023px) {
1653
+ @media screen and (min-width: 768px) and (max-width: 1023px) {
1669
1654
  .mfui-container .mfui-instructions + .mfui-benefits-icons {
1670
1655
  margin-top: 48px;
1671
1656
  }
@@ -1699,12 +1684,6 @@ h5 {
1699
1684
  .mfui-container .mfui-instructions + .mfui-accordion-box {
1700
1685
  margin-top: 48px;
1701
1686
  }
1702
- .mfui-container .mfui-instructions + .mfui-button-link-box {
1703
- margin-top: 48px;
1704
- }
1705
- .mfui-container .mfui-instructions + .mfui-download-links {
1706
- margin-top: 48px;
1707
- }
1708
1687
  .mfui-container .mfui-instructions + .mfui-text-box {
1709
1688
  margin-top: 48px;
1710
1689
  }
@@ -1721,9 +1700,55 @@ h5 {
1721
1700
  margin-top: 48px;
1722
1701
  }
1723
1702
  }
1724
- .mfui-container .mfui-instructions + .mfui-button-link-box,
1725
- .mfui-container .mfui-instructions + .mfui-download-links {
1726
- margin-top: 0 !important;
1703
+ @media screen and (max-width: 767px) {
1704
+ .mfui-container .mfui-instructions + .mfui-benefits-icons {
1705
+ margin-top: 40px;
1706
+ }
1707
+ .mfui-container .mfui-instructions + .mfui-benefits-pictures {
1708
+ margin-top: 40px;
1709
+ }
1710
+ .mfui-container .mfui-instructions + .mfui-cards-box {
1711
+ margin-top: 40px;
1712
+ }
1713
+ .mfui-container .mfui-instructions + .mfui-carousel-box {
1714
+ margin-top: 40px;
1715
+ }
1716
+ .mfui-container .mfui-instructions + .mfui-video-block {
1717
+ margin-top: 40px;
1718
+ }
1719
+ .mfui-container .mfui-instructions + .mfui-tabs-box {
1720
+ margin-top: 40px;
1721
+ }
1722
+ .mfui-container .mfui-instructions + .mfui-partners {
1723
+ margin-top: 40px;
1724
+ }
1725
+ .mfui-container .mfui-instructions + .mfui-instructions {
1726
+ margin-top: 40px;
1727
+ }
1728
+ .mfui-container .mfui-instructions + .mfui-property {
1729
+ margin-top: 40px;
1730
+ }
1731
+ .mfui-container .mfui-instructions + .mfui-table {
1732
+ margin-top: 40px;
1733
+ }
1734
+ .mfui-container .mfui-instructions + .mfui-accordion-box {
1735
+ margin-top: 40px;
1736
+ }
1737
+ .mfui-container .mfui-instructions + .mfui-text-box {
1738
+ margin-top: 40px;
1739
+ }
1740
+ .mfui-container .mfui-instructions + .mfui-picture-with-description {
1741
+ margin-top: 40px;
1742
+ }
1743
+ .mfui-container .mfui-instructions + .mfui-store-banner {
1744
+ margin-top: 40px;
1745
+ }
1746
+ .mfui-container .mfui-instructions + .mfui-button-banner {
1747
+ margin-top: 40px;
1748
+ }
1749
+ .mfui-container .mfui-instructions + .mfui-steps {
1750
+ margin-top: 40px;
1751
+ }
1727
1752
  }
1728
1753
  .mfui-container .mfui-property + .mfui-benefits-icons {
1729
1754
  margin-top: 56px;
@@ -2091,6 +2116,9 @@ h5 {
2091
2116
  .mfui-container .mfui-accordion-box + .mfui-button-link-box {
2092
2117
  margin-top: 32px;
2093
2118
  }
2119
+ .mfui-container .mfui-accordion-box + .mfui-download-links {
2120
+ margin-top: 48px;
2121
+ }
2094
2122
  .mfui-container .mfui-accordion-box + .mfui-text-box {
2095
2123
  margin-top: 56px;
2096
2124
  }
@@ -2100,6 +2128,9 @@ h5 {
2100
2128
  }
2101
2129
  }
2102
2130
  @media screen and (max-width: 767px) {
2131
+ .mfui-container .mfui-accordion-box + .mfui-download-links {
2132
+ margin-top: 40px;
2133
+ }
2103
2134
  .mfui-container .mfui-accordion-box + .mfui-text-box {
2104
2135
  margin-top: 40px;
2105
2136
  }
@@ -2507,6 +2538,22 @@ h5 {
2507
2538
  margin-top: 32px;
2508
2539
  }
2509
2540
  }
2541
+ .mfui-container .mfui-store-banner + .mfui-download-links {
2542
+ margin-top: 48px;
2543
+ }
2544
+ @media screen and (max-width: 767px) {
2545
+ .mfui-container .mfui-store-banner + .mfui-download-links {
2546
+ margin-top: 40px;
2547
+ }
2548
+ }
2549
+ .mfui-container .mfui-button-banner + .mfui-download-links {
2550
+ margin-top: 48px;
2551
+ }
2552
+ @media screen and (max-width: 767px) {
2553
+ .mfui-container .mfui-button-banner + .mfui-download-links {
2554
+ margin-top: 40px;
2555
+ }
2556
+ }
2510
2557
  .mfui-container .mfui-steps + .mfui-benefits-icons {
2511
2558
  margin-top: 56px;
2512
2559
  }
@@ -31,6 +31,6 @@ h5 {
31
31
  margin: 0;
32
32
  font-size: 12px;
33
33
  line-height: 16px;
34
- color: rgba(51, 51, 51, 0.5);
34
+ color: #33333380;
35
35
  text-transform: uppercase;
36
36
  }
@@ -5,9 +5,11 @@ h4,
5
5
  h5 {
6
6
  margin: 0;
7
7
  }
8
+ .mfui-store-banner_theme_base .mfui-store-banner__grid,
8
9
  .mfui-store-banner_theme_clearWhite .mfui-store-banner__grid {
9
10
  background-color: #FFFFFF;
10
11
  }
12
+ .mfui-store-banner_theme_base .mfui-store-banner__content,
11
13
  .mfui-store-banner_theme_clearWhite .mfui-store-banner__content {
12
14
  color: #333333;
13
15
  }
@@ -220,8 +222,10 @@ h5 {
220
222
  -webkit-transform: translateX(-50%);
221
223
  transform: translateX(-50%);
222
224
  }
223
- .mfui-store-banner__button {
224
- margin: 0 auto;
225
+ @media screen and (max-width: 767px) {
226
+ .mfui-store-banner__button {
227
+ margin: 0 auto;
228
+ }
225
229
  }
226
230
  .mfui-store-banner__links_three .mfui-store-banner__qr-code {
227
231
  -o-object-fit: contain;
@@ -2,9 +2,11 @@ import * as React from 'react';
2
2
  import { Props as StoreButtonPropsType } from '../StoreButton/StoreButton';
3
3
  import './StoreBanner.less';
4
4
  export declare const Theme: {
5
- readonly CLEAR_WHITE: "clearWhite";
5
+ readonly BASE: "base";
6
6
  readonly GREEN: "green";
7
7
  readonly SPB_SKY_1: "spbSky1";
8
+ /** @deprecated */
9
+ readonly CLEAR_WHITE: "clearWhite";
8
10
  };
9
11
  declare type ThemeType = typeof Theme[keyof typeof Theme];
10
12
  export declare const DeviceMask: {
@@ -1,4 +1,7 @@
1
+ import "core-js/modules/es.array.concat";
2
+ import "core-js/modules/es.array.includes";
1
3
  import "core-js/modules/es.object.values";
4
+ import "core-js/modules/es.string.includes";
2
5
  import _extends from "@babel/runtime/helpers/extends";
3
6
  import * as React from 'react';
4
7
  import { Button, Grid, GridColumn, Header, Paragraph } from '@megafon/ui-core';
@@ -7,9 +10,12 @@ import PropTypes from 'prop-types';
7
10
  import StoreButton, { Theme as StoreButtonTheme } from "../StoreButton/StoreButton";
8
11
  import "./StoreBanner.css";
9
12
  export var Theme = {
10
- CLEAR_WHITE: 'clearWhite',
13
+ BASE: 'base',
11
14
  GREEN: 'green',
12
- SPB_SKY_1: 'spbSky1'
15
+ SPB_SKY_1: 'spbSky1',
16
+
17
+ /** @deprecated */
18
+ CLEAR_WHITE: 'clearWhite'
13
19
  };
14
20
  export var DeviceMask = {
15
21
  ANDROID: 'android',
@@ -129,7 +135,6 @@ StoreBanner.propTypes = {
129
135
  linkGoogle: PropTypes.string,
130
136
  onClickGoogle: PropTypes.func,
131
137
  qrCode: PropTypes.string,
132
- theme: PropTypes.oneOf(Object.values(Theme)),
133
138
  deviceMask: PropTypes.oneOf(Object.values(DeviceMask)).isRequired,
134
139
  imageSrc: PropTypes.string.isRequired,
135
140
  className: PropTypes.string,
@@ -140,6 +145,20 @@ StoreBanner.propTypes = {
140
145
  rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
141
146
  current: PropTypes.elementType
142
147
  }), PropTypes.any])]),
143
- dataAttrs: PropTypes.objectOf(PropTypes.string.isRequired)
148
+ dataAttrs: PropTypes.objectOf(PropTypes.string.isRequired),
149
+ theme: function theme(props, propName, componentName) {
150
+ var deprecatedValue = Theme.CLEAR_WHITE;
151
+ var propValue = props[propName];
152
+
153
+ if (propValue && !Object.values(Theme).includes(propValue)) {
154
+ return new Error("Failed prop type: Invalid prop '".concat(propName, "' of value '").concat(propValue, "' supplied to '").concat(componentName, "',\n expected one of [").concat(Object.values(Theme), "]"));
155
+ }
156
+
157
+ if (propValue && propValue === deprecatedValue) {
158
+ return new Error("Failed prop type: Invalid prop '".concat(propName, "' of value '").concat(propValue, "' supplied to '").concat(componentName, "',\n value '").concat(deprecatedValue, "' is deprecated, please use value '").concat(Theme.BASE, "'"));
159
+ }
160
+
161
+ return null;
162
+ }
144
163
  };
145
164
  export default StoreBanner;
@@ -128,7 +128,7 @@ h5 {
128
128
  line-height: 16px;
129
129
  height: 72px;
130
130
  padding-bottom: 12px;
131
- color: rgba(51, 51, 51, 0.5);
131
+ color: #33333380;
132
132
  vertical-align: bottom;
133
133
  background-color: #F6F6F6;
134
134
  }
@@ -1325,10 +1325,8 @@ h5 {
1325
1325
  .mfui-container .mfui-tabs-box + .mfui-button-link-box {
1326
1326
  margin-top: 48px;
1327
1327
  }
1328
- @media screen and (max-width: 767px) {
1329
- .mfui-container .mfui-tabs-box + .mfui-button-link-box {
1330
- margin-top: 32px;
1331
- }
1328
+ .mfui-container .mfui-tabs-box + .mfui-download-links {
1329
+ margin-top: 48px;
1332
1330
  }
1333
1331
  .mfui-container .mfui-tabs-box + .mfui-text-box {
1334
1332
  margin-top: 56px;
@@ -1339,6 +1337,12 @@ h5 {
1339
1337
  }
1340
1338
  }
1341
1339
  @media screen and (max-width: 767px) {
1340
+ .mfui-container .mfui-tabs-box + .mfui-button-link-box {
1341
+ margin-top: 32px;
1342
+ }
1343
+ .mfui-container .mfui-tabs-box + .mfui-download-links {
1344
+ margin-top: 40px;
1345
+ }
1342
1346
  .mfui-container .mfui-tabs-box + .mfui-text-box {
1343
1347
  margin-top: 40px;
1344
1348
  }
@@ -1438,9 +1442,6 @@ h5 {
1438
1442
  .mfui-container .mfui-tabs-box .mfui-tabs-box {
1439
1443
  margin-top: 0 !important;
1440
1444
  }
1441
- .mfui-container .mfui-partners + .mfui-button-link-box {
1442
- margin-top: 48px;
1443
- }
1444
1445
  .mfui-container .mfui-partners + .mfui-benefits-icons {
1445
1446
  margin-top: 56px;
1446
1447
  }
@@ -1459,9 +1460,6 @@ h5 {
1459
1460
  .mfui-container .mfui-partners + .mfui-tabs-box {
1460
1461
  margin-top: 56px;
1461
1462
  }
1462
- .mfui-container .mfui-partners + .mfui-partners {
1463
- margin-top: 56px;
1464
- }
1465
1463
  .mfui-container .mfui-partners + .mfui-instructions {
1466
1464
  margin-top: 56px;
1467
1465
  }
@@ -1475,10 +1473,10 @@ h5 {
1475
1473
  margin-top: 56px;
1476
1474
  }
1477
1475
  .mfui-container .mfui-partners + .mfui-button-link-box {
1478
- margin-top: 56px;
1476
+ margin-top: 48px;
1479
1477
  }
1480
1478
  .mfui-container .mfui-partners + .mfui-download-links {
1481
- margin-top: 56px;
1479
+ margin-top: 32px;
1482
1480
  }
1483
1481
  .mfui-container .mfui-partners + .mfui-text-box {
1484
1482
  margin-top: 56px;
@@ -1514,9 +1512,6 @@ h5 {
1514
1512
  .mfui-container .mfui-partners + .mfui-tabs-box {
1515
1513
  margin-top: 48px;
1516
1514
  }
1517
- .mfui-container .mfui-partners + .mfui-partners {
1518
- margin-top: 48px;
1519
- }
1520
1515
  .mfui-container .mfui-partners + .mfui-instructions {
1521
1516
  margin-top: 48px;
1522
1517
  }
@@ -1570,9 +1565,6 @@ h5 {
1570
1565
  .mfui-container .mfui-partners + .mfui-tabs-box {
1571
1566
  margin-top: 40px;
1572
1567
  }
1573
- .mfui-container .mfui-partners + .mfui-partners {
1574
- margin-top: 40px;
1575
- }
1576
1568
  .mfui-container .mfui-partners + .mfui-instructions {
1577
1569
  margin-top: 40px;
1578
1570
  }
@@ -1607,10 +1599,6 @@ h5 {
1607
1599
  margin-top: 40px;
1608
1600
  }
1609
1601
  }
1610
- .mfui-container .mfui-partners + .mfui-partners,
1611
- .mfui-container .mfui-partners + .mfui-download-links {
1612
- margin-top: 0 !important;
1613
- }
1614
1602
  .mfui-container .mfui-instructions + .mfui-benefits-icons {
1615
1603
  margin-top: 56px;
1616
1604
  }
@@ -1644,11 +1632,8 @@ h5 {
1644
1632
  .mfui-container .mfui-instructions + .mfui-accordion-box {
1645
1633
  margin-top: 56px;
1646
1634
  }
1647
- .mfui-container .mfui-instructions + .mfui-button-link-box {
1648
- margin-top: 56px;
1649
- }
1650
1635
  .mfui-container .mfui-instructions + .mfui-download-links {
1651
- margin-top: 56px;
1636
+ margin-top: 32px;
1652
1637
  }
1653
1638
  .mfui-container .mfui-instructions + .mfui-text-box {
1654
1639
  margin-top: 56px;
@@ -1665,7 +1650,7 @@ h5 {
1665
1650
  .mfui-container .mfui-instructions + .mfui-steps {
1666
1651
  margin-top: 56px;
1667
1652
  }
1668
- @media screen and (max-width: 1023px) {
1653
+ @media screen and (min-width: 768px) and (max-width: 1023px) {
1669
1654
  .mfui-container .mfui-instructions + .mfui-benefits-icons {
1670
1655
  margin-top: 48px;
1671
1656
  }
@@ -1699,12 +1684,6 @@ h5 {
1699
1684
  .mfui-container .mfui-instructions + .mfui-accordion-box {
1700
1685
  margin-top: 48px;
1701
1686
  }
1702
- .mfui-container .mfui-instructions + .mfui-button-link-box {
1703
- margin-top: 48px;
1704
- }
1705
- .mfui-container .mfui-instructions + .mfui-download-links {
1706
- margin-top: 48px;
1707
- }
1708
1687
  .mfui-container .mfui-instructions + .mfui-text-box {
1709
1688
  margin-top: 48px;
1710
1689
  }
@@ -1721,9 +1700,55 @@ h5 {
1721
1700
  margin-top: 48px;
1722
1701
  }
1723
1702
  }
1724
- .mfui-container .mfui-instructions + .mfui-button-link-box,
1725
- .mfui-container .mfui-instructions + .mfui-download-links {
1726
- margin-top: 0 !important;
1703
+ @media screen and (max-width: 767px) {
1704
+ .mfui-container .mfui-instructions + .mfui-benefits-icons {
1705
+ margin-top: 40px;
1706
+ }
1707
+ .mfui-container .mfui-instructions + .mfui-benefits-pictures {
1708
+ margin-top: 40px;
1709
+ }
1710
+ .mfui-container .mfui-instructions + .mfui-cards-box {
1711
+ margin-top: 40px;
1712
+ }
1713
+ .mfui-container .mfui-instructions + .mfui-carousel-box {
1714
+ margin-top: 40px;
1715
+ }
1716
+ .mfui-container .mfui-instructions + .mfui-video-block {
1717
+ margin-top: 40px;
1718
+ }
1719
+ .mfui-container .mfui-instructions + .mfui-tabs-box {
1720
+ margin-top: 40px;
1721
+ }
1722
+ .mfui-container .mfui-instructions + .mfui-partners {
1723
+ margin-top: 40px;
1724
+ }
1725
+ .mfui-container .mfui-instructions + .mfui-instructions {
1726
+ margin-top: 40px;
1727
+ }
1728
+ .mfui-container .mfui-instructions + .mfui-property {
1729
+ margin-top: 40px;
1730
+ }
1731
+ .mfui-container .mfui-instructions + .mfui-table {
1732
+ margin-top: 40px;
1733
+ }
1734
+ .mfui-container .mfui-instructions + .mfui-accordion-box {
1735
+ margin-top: 40px;
1736
+ }
1737
+ .mfui-container .mfui-instructions + .mfui-text-box {
1738
+ margin-top: 40px;
1739
+ }
1740
+ .mfui-container .mfui-instructions + .mfui-picture-with-description {
1741
+ margin-top: 40px;
1742
+ }
1743
+ .mfui-container .mfui-instructions + .mfui-store-banner {
1744
+ margin-top: 40px;
1745
+ }
1746
+ .mfui-container .mfui-instructions + .mfui-button-banner {
1747
+ margin-top: 40px;
1748
+ }
1749
+ .mfui-container .mfui-instructions + .mfui-steps {
1750
+ margin-top: 40px;
1751
+ }
1727
1752
  }
1728
1753
  .mfui-container .mfui-property + .mfui-benefits-icons {
1729
1754
  margin-top: 56px;
@@ -2091,6 +2116,9 @@ h5 {
2091
2116
  .mfui-container .mfui-accordion-box + .mfui-button-link-box {
2092
2117
  margin-top: 32px;
2093
2118
  }
2119
+ .mfui-container .mfui-accordion-box + .mfui-download-links {
2120
+ margin-top: 48px;
2121
+ }
2094
2122
  .mfui-container .mfui-accordion-box + .mfui-text-box {
2095
2123
  margin-top: 56px;
2096
2124
  }
@@ -2100,6 +2128,9 @@ h5 {
2100
2128
  }
2101
2129
  }
2102
2130
  @media screen and (max-width: 767px) {
2131
+ .mfui-container .mfui-accordion-box + .mfui-download-links {
2132
+ margin-top: 40px;
2133
+ }
2103
2134
  .mfui-container .mfui-accordion-box + .mfui-text-box {
2104
2135
  margin-top: 40px;
2105
2136
  }
@@ -2507,6 +2538,22 @@ h5 {
2507
2538
  margin-top: 32px;
2508
2539
  }
2509
2540
  }
2541
+ .mfui-container .mfui-store-banner + .mfui-download-links {
2542
+ margin-top: 48px;
2543
+ }
2544
+ @media screen and (max-width: 767px) {
2545
+ .mfui-container .mfui-store-banner + .mfui-download-links {
2546
+ margin-top: 40px;
2547
+ }
2548
+ }
2549
+ .mfui-container .mfui-button-banner + .mfui-download-links {
2550
+ margin-top: 48px;
2551
+ }
2552
+ @media screen and (max-width: 767px) {
2553
+ .mfui-container .mfui-button-banner + .mfui-download-links {
2554
+ margin-top: 40px;
2555
+ }
2556
+ }
2510
2557
  .mfui-container .mfui-steps + .mfui-benefits-icons {
2511
2558
  margin-top: 56px;
2512
2559
  }
@@ -31,6 +31,6 @@ h5 {
31
31
  margin: 0;
32
32
  font-size: 12px;
33
33
  line-height: 16px;
34
- color: rgba(51, 51, 51, 0.5);
34
+ color: #33333380;
35
35
  text-transform: uppercase;
36
36
  }
@@ -5,9 +5,11 @@ h4,
5
5
  h5 {
6
6
  margin: 0;
7
7
  }
8
+ .mfui-store-banner_theme_base .mfui-store-banner__grid,
8
9
  .mfui-store-banner_theme_clearWhite .mfui-store-banner__grid {
9
10
  background-color: #FFFFFF;
10
11
  }
12
+ .mfui-store-banner_theme_base .mfui-store-banner__content,
11
13
  .mfui-store-banner_theme_clearWhite .mfui-store-banner__content {
12
14
  color: #333333;
13
15
  }
@@ -220,8 +222,10 @@ h5 {
220
222
  -webkit-transform: translateX(-50%);
221
223
  transform: translateX(-50%);
222
224
  }
223
- .mfui-store-banner__button {
224
- margin: 0 auto;
225
+ @media screen and (max-width: 767px) {
226
+ .mfui-store-banner__button {
227
+ margin: 0 auto;
228
+ }
225
229
  }
226
230
  .mfui-store-banner__links_three .mfui-store-banner__qr-code {
227
231
  -o-object-fit: contain;
@@ -2,9 +2,11 @@ import * as React from 'react';
2
2
  import { Props as StoreButtonPropsType } from '../StoreButton/StoreButton';
3
3
  import './StoreBanner.less';
4
4
  export declare const Theme: {
5
- readonly CLEAR_WHITE: "clearWhite";
5
+ readonly BASE: "base";
6
6
  readonly GREEN: "green";
7
7
  readonly SPB_SKY_1: "spbSky1";
8
+ /** @deprecated */
9
+ readonly CLEAR_WHITE: "clearWhite";
8
10
  };
9
11
  declare type ThemeType = typeof Theme[keyof typeof Theme];
10
12
  export declare const DeviceMask: {
@@ -7,8 +7,14 @@ Object.defineProperty(exports, "__esModule", {
7
7
  });
8
8
  exports["default"] = exports.DeviceMask = exports.Theme = void 0;
9
9
 
10
+ require("core-js/modules/es.array.concat");
11
+
12
+ require("core-js/modules/es.array.includes");
13
+
10
14
  require("core-js/modules/es.object.values");
11
15
 
16
+ require("core-js/modules/es.string.includes");
17
+
12
18
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
13
19
 
14
20
  var React = _interopRequireWildcard(require("react"));
@@ -28,9 +34,12 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
28
34
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
29
35
 
30
36
  var Theme = {
31
- CLEAR_WHITE: 'clearWhite',
37
+ BASE: 'base',
32
38
  GREEN: 'green',
33
- SPB_SKY_1: 'spbSky1'
39
+ SPB_SKY_1: 'spbSky1',
40
+
41
+ /** @deprecated */
42
+ CLEAR_WHITE: 'clearWhite'
34
43
  };
35
44
  exports.Theme = Theme;
36
45
  var DeviceMask = {
@@ -152,7 +161,6 @@ StoreBanner.propTypes = {
152
161
  linkGoogle: _propTypes["default"].string,
153
162
  onClickGoogle: _propTypes["default"].func,
154
163
  qrCode: _propTypes["default"].string,
155
- theme: _propTypes["default"].oneOf(Object.values(Theme)),
156
164
  deviceMask: _propTypes["default"].oneOf(Object.values(DeviceMask)).isRequired,
157
165
  imageSrc: _propTypes["default"].string.isRequired,
158
166
  className: _propTypes["default"].string,
@@ -163,7 +171,21 @@ StoreBanner.propTypes = {
163
171
  rootRef: _propTypes["default"].oneOfType([_propTypes["default"].func, _propTypes["default"].oneOfType([_propTypes["default"].shape({
164
172
  current: _propTypes["default"].elementType
165
173
  }), _propTypes["default"].any])]),
166
- dataAttrs: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired)
174
+ dataAttrs: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired),
175
+ theme: function theme(props, propName, componentName) {
176
+ var deprecatedValue = Theme.CLEAR_WHITE;
177
+ var propValue = props[propName];
178
+
179
+ if (propValue && !Object.values(Theme).includes(propValue)) {
180
+ return new Error("Failed prop type: Invalid prop '".concat(propName, "' of value '").concat(propValue, "' supplied to '").concat(componentName, "',\n expected one of [").concat(Object.values(Theme), "]"));
181
+ }
182
+
183
+ if (propValue && propValue === deprecatedValue) {
184
+ return new Error("Failed prop type: Invalid prop '".concat(propName, "' of value '").concat(propValue, "' supplied to '").concat(componentName, "',\n value '").concat(deprecatedValue, "' is deprecated, please use value '").concat(Theme.BASE, "'"));
185
+ }
186
+
187
+ return null;
188
+ }
167
189
  };
168
190
  var _default = StoreBanner;
169
191
  exports["default"] = _default;
@@ -128,7 +128,7 @@ h5 {
128
128
  line-height: 16px;
129
129
  height: 72px;
130
130
  padding-bottom: 12px;
131
- color: rgba(51, 51, 51, 0.5);
131
+ color: #33333380;
132
132
  vertical-align: bottom;
133
133
  background-color: #F6F6F6;
134
134
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megafon/ui-shared",
3
- "version": "2.0.1",
3
+ "version": "2.1.0",
4
4
  "files": [
5
5
  "dist"
6
6
  ],
@@ -27,6 +27,7 @@
27
27
  "lint": "yarn lint:ts && yarn lint:less",
28
28
  "lint:ts": "eslint --ext .js,.jsx,.ts,.tsx src --max-warnings=0",
29
29
  "lint:less": "stylelint --syntax less src/**/*.less src/**/**/*.less",
30
+ "lint:less:fix": "yarn lint:less --fix",
30
31
  "test": "yarn test:unit",
31
32
  "test:unit": "jest",
32
33
  "test:update": "jest --updateSnapshot"
@@ -50,7 +51,7 @@
50
51
  "@babel/preset-env": "^7.8.6",
51
52
  "@babel/preset-react": "^7.8.3",
52
53
  "@babel/preset-typescript": "^7.8.3",
53
- "@megafon/ui-icons": "^0.1.0",
54
+ "@megafon/ui-icons": "^0.1.1",
54
55
  "@svgr/core": "^2.4.1",
55
56
  "@types/enzyme": "^3.10.5",
56
57
  "@types/enzyme-adapter-react-16": "^1.0.6",
@@ -80,7 +81,7 @@
80
81
  },
81
82
  "dependencies": {
82
83
  "@babel/runtime": "^7.8.4",
83
- "@megafon/ui-core": "^2.1.0",
84
+ "@megafon/ui-core": "^2.1.1",
84
85
  "@megafon/ui-helpers": "^1.0.0",
85
86
  "core-js": "^3.6.4",
86
87
  "htmr": "^0.9.2",
@@ -88,5 +89,5 @@
88
89
  "prop-types": "^15.7.2",
89
90
  "swiper": "^6.5.6"
90
91
  },
91
- "gitHead": "42bd6840a217196ba9e80c6c77f92f5951881c12"
92
+ "gitHead": "31bd33b5e87106ea511fbbdc8ad266f70457e3d3"
92
93
  }