ecomlab-components-next 0.1.238 → 0.1.239

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 (77) hide show
  1. package/dist/components/Buttons/ButtonBasicV2/ButtonBasicV2.js +85 -0
  2. package/dist/components/Buttons/ButtonBasicV2/ButtonBasicV2.scss +55 -0
  3. package/dist/components/Buttons/ButtonBasicV2/ButtonBasicV2stories.js +43 -0
  4. package/dist/components/ConstructorComponents/ArticlesBlockV2/ArticlesBlockV2.js +153 -0
  5. package/dist/components/ConstructorComponents/ArticlesBlockV2/ArticlesBlockV2.module.scss +214 -0
  6. package/dist/components/ConstructorComponents/BlocksInfo/BlocksInfo.scss +0 -1
  7. package/dist/components/ConstructorComponents/BlocksInfoV2/BlocksInfoV2.js +210 -0
  8. package/dist/components/ConstructorComponents/BlocksInfoV2/BlocksInfoV2.scss +236 -0
  9. package/dist/components/ConstructorComponents/BlocksInfoV2/BlocksInfoV2.stories.js +57 -0
  10. package/dist/components/ConstructorComponents/BlocksInfoV2/img/develop.png +0 -0
  11. package/dist/components/ConstructorComponents/CardsInfo/CardsInfo.js +15 -29
  12. package/dist/components/ConstructorComponents/CardsServicesV2/CardsServicesV2.js +164 -0
  13. package/dist/components/ConstructorComponents/CardsServicesV2/CardsServicesV2.scss +333 -0
  14. package/dist/components/ConstructorComponents/CardsV2/CardsV2.js +51 -0
  15. package/dist/components/ConstructorComponents/CardsV2/CardsV2.scss +158 -0
  16. package/dist/components/ConstructorComponents/CardsV2/CardsV2.stories.js +16 -0
  17. package/dist/components/ConstructorComponents/ClientsAboutUsV2/ClientsAboutUsV2.js +83 -0
  18. package/dist/components/ConstructorComponents/ClientsAboutUsV2/ClientsAboutUsV2.scss +312 -0
  19. package/dist/components/ConstructorComponents/ClientsAboutUsV2/ClientsAboutUsV2.stories.js +25 -0
  20. package/dist/components/ConstructorComponents/FeaturesGridV2/FeaturesGridV2.js +102 -0
  21. package/dist/components/ConstructorComponents/FeaturesGridV2/FeaturesGridV2.scss +145 -0
  22. package/dist/components/ConstructorComponents/FeaturesGridV2/FeaturesGridV2.stories.js +36 -0
  23. package/dist/components/ConstructorComponents/FormV2/FormV2.js +139 -0
  24. package/dist/components/ConstructorComponents/FormV2/FormV2.scss +153 -0
  25. package/dist/components/ConstructorComponents/FormV2/FormWithBtn.stories.js +16 -0
  26. package/dist/components/ConstructorComponents/Header/Header.js +1 -1
  27. package/dist/components/ConstructorComponents/HeaderV2/HeaderV2.js +127 -0
  28. package/dist/components/ConstructorComponents/HeaderV2/HeaderV2.scss +227 -0
  29. package/dist/components/ConstructorComponents/HeaderV2/HeaderV2.stories.js +24 -0
  30. package/dist/components/ConstructorComponents/HeaderV2/img/Ozon.svg +20 -0
  31. package/dist/components/ConstructorComponents/HeaderV2/img/WB.svg +15 -0
  32. package/dist/components/ConstructorComponents/HeaderV2/img/Yandex Market.svg +14 -0
  33. package/dist/components/ConstructorComponents/MainContainer/MainContainer.js +4 -2
  34. package/dist/components/ConstructorComponents/MainContainer/MainContainer.scss +24 -0
  35. package/dist/components/ConstructorComponents/MainContainer/MainContainerV2.stories.js +199 -0
  36. package/dist/components/ConstructorComponents/MarqueImgsV2/MarqueImgsV2.js +48 -0
  37. package/dist/components/ConstructorComponents/MarqueImgsV2/MarqueImgsV2.scss +66 -0
  38. package/dist/components/ConstructorComponents/MarqueImgsV2/MarqueImgsV2.stories.js +16 -0
  39. package/dist/components/ConstructorComponents/MarqueImgsV2/img/brand_1.svg +4 -0
  40. package/dist/components/ConstructorComponents/MarqueImgsV2/img/brand_10.svg +9 -0
  41. package/dist/components/ConstructorComponents/MarqueImgsV2/img/brand_11.svg +10 -0
  42. package/dist/components/ConstructorComponents/MarqueImgsV2/img/brand_12.svg +11 -0
  43. package/dist/components/ConstructorComponents/MarqueImgsV2/img/brand_13.svg +9 -0
  44. package/dist/components/ConstructorComponents/MarqueImgsV2/img/brand_2.svg +10 -0
  45. package/dist/components/ConstructorComponents/MarqueImgsV2/img/brand_3.svg +10 -0
  46. package/dist/components/ConstructorComponents/MarqueImgsV2/img/brand_4.svg +28 -0
  47. package/dist/components/ConstructorComponents/MarqueImgsV2/img/brand_5.svg +9 -0
  48. package/dist/components/ConstructorComponents/MarqueImgsV2/img/brand_6.svg +26 -0
  49. package/dist/components/ConstructorComponents/MarqueImgsV2/img/brand_7.png +0 -0
  50. package/dist/components/ConstructorComponents/MarqueImgsV2/img/brand_7.svg +17 -0
  51. package/dist/components/ConstructorComponents/MarqueImgsV2/img/brand_8.svg +9 -0
  52. package/dist/components/ConstructorComponents/MarqueImgsV2/img/brand_9.svg +9 -0
  53. package/dist/components/ConstructorComponents/PhoneBlockV2/PhoneBlockV2.js +40 -0
  54. package/dist/components/ConstructorComponents/PhoneBlockV2/PhoneBlockV2.scss +302 -0
  55. package/dist/components/ConstructorComponents/PhoneBlockV2/PhoneBlockV2.stories.js +19 -0
  56. package/dist/components/ConstructorComponents/PhoneBlockV2/img/phone.png +0 -0
  57. package/dist/components/ConstructorComponents/PointsListV2/PointsListV2.js +45 -0
  58. package/dist/components/ConstructorComponents/PointsListV2/PointsListV2.scss +151 -0
  59. package/dist/components/ConstructorComponents/PointsListV2/PointsListV2.stories.js +43 -0
  60. package/dist/components/ConstructorComponents/PointsListV2/img/bx-right-arrow-alt.svg +5 -0
  61. package/dist/components/ConstructorComponents/QuestionsV2/QuestionsV2.js +72 -0
  62. package/dist/components/ConstructorComponents/QuestionsV2/QuestionsV2.scss +179 -0
  63. package/dist/components/ConstructorComponents/QuestionsV2/QuestionsV2.stories.js +57 -0
  64. package/dist/components/ConstructorComponents/QuestionsV2/img/ar_down.svg +5 -0
  65. package/dist/components/ConstructorComponents/QuestionsV2/img/ar_up.svg +5 -0
  66. package/dist/components/ConstructorComponents/ServicesSectionV2/ServicesSectionV2.js +161 -0
  67. package/dist/components/ConstructorComponents/ServicesSectionV2/ServicesSectionV2.scss +245 -0
  68. package/dist/components/ConstructorComponents/StatisticCardV2/StatisticCardV2.js +44 -0
  69. package/dist/components/ConstructorComponents/StatisticCardV2/StatisticCardV2.module.scss +156 -0
  70. package/dist/components/ConstructorComponents/StatisticCardV2/StatisticCardV2.stories.js +32 -0
  71. package/dist/components/ConstructorComponents/StepsV2/StepsV2.js +86 -0
  72. package/dist/components/ConstructorComponents/StepsV2/StepsV2.module.scss +226 -0
  73. package/dist/components/ConstructorComponents/StepsV2/StepsV2.stories.js +30 -0
  74. package/dist/components/ConstructorComponents/variables.scss +50 -0
  75. package/dist/components/Slider/SliderCarousel/SliderCarousel.js +4 -6
  76. package/dist/index.js +84 -0
  77. package/package.json +1 -1
@@ -0,0 +1,158 @@
1
+ @import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
2
+ @import '../variables.scss';
3
+
4
+ .cards2-grey {
5
+ --purple: #6B5CE7;
6
+ --purple-light: #EEF0FF;
7
+ --purple-dark: #5448D0;
8
+ --text: #1A1A2E;
9
+ --muted: #6B7280;
10
+ --border: #E5E7EB;
11
+ --bg: #F7F8FC;
12
+ --white: #FFFFFF;
13
+
14
+ font-family: 'Manrope', sans-serif;
15
+ background: var(--white);
16
+ width: 100%;
17
+ box-sizing: border-box;
18
+ padding: 96px 48px;
19
+
20
+ * {
21
+ font-family: 'Manrope', 'Golos Text', sans-serif !important;
22
+ }
23
+ }
24
+
25
+ .cards2-grey__inner {
26
+ max-width: 1280px;
27
+ margin: 0 auto;
28
+ display: flex;
29
+ flex-direction: column;
30
+ gap: 48px;
31
+ }
32
+
33
+ /* ── Title ── */
34
+ .cards2-grey__title {
35
+ font-size: 30px;
36
+ font-weight: 800;
37
+ letter-spacing: -0.5px;
38
+ color: var(--text);
39
+ margin: 0;
40
+ text-align: center;
41
+ }
42
+
43
+ /* ── Grid ── */
44
+ .cards2-grey__items {
45
+ display: grid;
46
+ grid-template-columns: repeat(4, 1fr);
47
+ gap: 16px;
48
+ }
49
+
50
+ /* ── Card ── */
51
+ .cards2-grey__item {
52
+ background: var(--bg);
53
+ border: 1px solid var(--border);
54
+ border-radius: 16px;
55
+ padding: 32px 28px;
56
+ display: flex;
57
+ flex-direction: column;
58
+ gap: 14px;
59
+ transition: transform .2s, box-shadow .2s;
60
+ box-sizing: border-box;
61
+ }
62
+
63
+ .cards2-grey__item:hover {
64
+ transform: translateY(-4px);
65
+ box-shadow: 0 12px 32px rgba(0, 0, 0, .08);
66
+ }
67
+
68
+ /* accent top bar */
69
+ .cards2-grey__item::before {
70
+ content: '';
71
+ display: block;
72
+ width: 32px;
73
+ height: 3px;
74
+ border-radius: 99px;
75
+ background: $green;
76
+ margin-bottom: 4px;
77
+ }
78
+
79
+ .cards2-grey__title-card {
80
+ font-size: 40px;
81
+ font-weight: 800;
82
+ letter-spacing: -1.5px;
83
+ color: var(--text);
84
+ margin: 0;
85
+ line-height: 1;
86
+ background: linear-gradient(135deg, $green 0%, $green 100%);
87
+ -webkit-background-clip: text;
88
+ -webkit-text-fill-color: transparent;
89
+ background-clip: text;
90
+ }
91
+
92
+ .cards2-grey__description-card {
93
+ font-size: 13px;
94
+ font-weight: 500;
95
+ color: var(--muted);
96
+ line-height: 1.65;
97
+ margin: 0;
98
+ }
99
+
100
+ /* ── TABLET (≤ 900px) ── */
101
+ @media (max-width: 900px) {
102
+ .cards2-grey {
103
+ padding: 72px 32px;
104
+ }
105
+
106
+ .cards2-grey__items {
107
+ grid-template-columns: repeat(2, 1fr);
108
+ }
109
+
110
+ .cards2-grey__title {
111
+ font-size: 26px;
112
+ }
113
+ }
114
+
115
+ /* ── MOBILE (≤ 600px) ── */
116
+ @media (max-width: 600px) {
117
+ .cards2-grey {
118
+ padding: 56px 24px;
119
+ }
120
+
121
+ .cards2-grey__items {
122
+ grid-template-columns: repeat(2, 1fr);
123
+ gap: 12px;
124
+ }
125
+
126
+ .cards2-grey__title-card {
127
+ font-size: 32px;
128
+ }
129
+ }
130
+
131
+ /* ── SMALL MOBILE (≤ 430px) ── */
132
+ @media (max-width: 430px) {
133
+ .cards2-grey {
134
+ padding: 40px 16px;
135
+ }
136
+
137
+ .cards2-grey__title {
138
+ font-size: 22px;
139
+ }
140
+
141
+ .cards2-grey__items {
142
+ grid-template-columns: 1fr 1fr;
143
+ gap: 10px;
144
+ }
145
+
146
+ .cards2-grey__item {
147
+ padding: 24px 18px;
148
+ gap: 10px;
149
+ }
150
+
151
+ .cards2-grey__title-card {
152
+ font-size: 28px;
153
+ }
154
+
155
+ .cards2-grey__description-card {
156
+ font-size: 12px;
157
+ }
158
+ }
@@ -0,0 +1,16 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = exports.CardsV2Test = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _CardsV = _interopRequireDefault(require("./CardsV2"));
9
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
10
+ var _default = exports["default"] = {
11
+ title: 'CardsV2',
12
+ component: _CardsV["default"]
13
+ };
14
+ var CardsV2Test = exports.CardsV2Test = function CardsV2Test() {
15
+ return /*#__PURE__*/_react["default"].createElement(_CardsV["default"], null);
16
+ };
@@ -0,0 +1,83 @@
1
+ "use strict";
2
+ 'use client';
3
+
4
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports["default"] = void 0;
9
+ var _react = _interopRequireWildcard(require("react"));
10
+ require("./ClientsAboutUsV2.scss");
11
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
12
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
13
+ function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
14
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
15
+ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
16
+ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
17
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
18
+ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
19
+ var list_about_us = [{
20
+ title: 'До сотрудничества с ECOMRU:',
21
+ description: /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, "\xB7 \u0411\u043E\u043B\u0435\u0435 4 \u0447\u0430\u0441\u043E\u0432 \u0432 \u0434\u0435\u043D\u044C \u0443\u0445\u043E\u0434\u0438\u043B\u043E \u043D\u0430 \u043C\u043E\u043D\u0438\u0442\u043E\u0440\u0438\u043D\u0433 \u043A\u043E\u043D\u043A\u0443\u0440\u0435\u043D\u0442\u043E\u0432 (\u0446\u0435\u043D\u044B, \u0430\u0441\u0441\u043E\u0440\u0442\u0438\u043C\u0435\u043D\u0442, \u043C\u0430\u0440\u043A\u0435\u0442\u0438\u043D\u0433\u043E\u0432\u044B\u0435 \u0430\u043A\u0442\u0438\u0432\u043D\u043E\u0441\u0442\u0438)", /*#__PURE__*/_react["default"].createElement("br", null), /*#__PURE__*/_react["default"].createElement("br", null), "\xB7 \u0414\u043E\u0445\u043E\u0434\u043D\u043E\u0441\u0442\u044C \u0431\u0438\u0437\u043D\u0435\u0441\u0430 \u0441\u0442\u043E\u044F\u043B\u0430 \u043D\u0430 \u043C\u0435\u0441\u0442\u0435, \u0438\u0437-\u0437\u0430 \u043D\u0435\u0445\u0432\u0430\u0442\u043A\u0438 \u0432\u0440\u0435\u043C\u0435\u043D\u0438 \u043D\u0430 \u0434\u0440\u0443\u0433\u0438\u0435 \u043F\u0440\u043E\u0446\u0435\u0441\u0441\u044B", /*#__PURE__*/_react["default"].createElement("br", null), /*#__PURE__*/_react["default"].createElement("br", null), "\xB7 \u041D\u0435 \u0431\u044B\u043B\u043E \u0432\u043E\u0437\u043C\u043E\u0436\u043D\u043E\u0441\u0442\u0438 \u0434\u043B\u044F \u043C\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u043E\u0432\u0430\u043D\u0438\u044F")
22
+ }, {
23
+ title: 'При сотрудничестве с ECOMRU:',
24
+ description: /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, "\xB7 \u0417\u0430\u0442\u0440\u0430\u0442\u044B \u0432\u0440\u0435\u043C\u0435\u043D\u0438 \u043D\u0430 \u0430\u043D\u0430\u043B\u0438\u0437 \u043A\u043E\u043D\u043A\u0443\u0440\u0435\u043D\u0442\u043E\u0432 \u0441\u043E\u043A\u0440\u0430\u0442\u0438\u043B\u0438\u0441\u044C \u0441 4 \u0447\u0430\u0441\u043E\u0432 \u0434\u043E 1 \u0447\u0430\u0441\u0430 \u0432 \u0434\u0435\u043D\u044C", /*#__PURE__*/_react["default"].createElement("br", null), /*#__PURE__*/_react["default"].createElement("br", null), "\xB7 \u0410\u0432\u0442\u043E\u043C\u0430\u0442\u0438\u0437\u0438\u0440\u043E\u0432\u0430\u043B\u0438 \u0446\u0435\u043D\u043E\u043E\u0431\u0440\u0430\u0437\u043E\u0432\u0430\u043D\u0438\u0435, \u043D\u0430\u0441\u0442\u0440\u043E\u0439\u043A\u0443 \u0440\u0435\u043A\u043B\u0430\u043C\u043D\u044B\u0445 \u043A\u0430\u043C\u043F\u0430\u043D\u0438\u0439 \u0438 \u0430\u0432\u0442\u043E\u043E\u0442\u0432\u0435\u0442\u044B \u043D\u0430 \u043E\u0442\u0437\u044B\u0432\u044B", /*#__PURE__*/_react["default"].createElement("br", null), /*#__PURE__*/_react["default"].createElement("br", null), "\xB7 \u0421\u043E\u0437\u0434\u0430\u043B\u0438 \u043C\u0430\u0433\u0430\u0437\u0438\u043D \u043D\u0430 OZON (\u0440\u0430\u043D\u044C\u0448\u0435 \u0431\u044B\u043B \u0442\u043E\u043B\u044C\u043A\u043E \u043D\u0430 Wildberries)", /*#__PURE__*/_react["default"].createElement("br", null), /*#__PURE__*/_react["default"].createElement("br", null), "\xB7 \u0420\u0430\u0441\u0448\u0438\u0440\u0438\u043B\u0438 \u0430\u0441\u0441\u043E\u0440\u0442\u0438\u043C\u0435\u043D\u0442 \u043D\u0430 \u0442\u0440\u0435\u0442\u044C, \u043D\u0430\u0448\u043B\u0438 \u043D\u043E\u0432\u044B\u0435 \u043F\u0435\u0440\u0441\u043F\u0435\u043A\u0442\u0438\u0432\u043D\u044B\u0435 \u0442\u043E\u0432\u0430\u0440\u044B \u0432 \u0441\u0432\u043E\u0435\u0439 \u043D\u0438\u0448\u0435", /*#__PURE__*/_react["default"].createElement("br", null), /*#__PURE__*/_react["default"].createElement("br", null), "\xB7 \u0423\u0432\u0435\u043B\u0438\u0447\u0438\u043B\u0438 \u043F\u0440\u0438\u0431\u044B\u043B\u044C \u0432\u0434\u0432\u043E\u0435, \u0438 \u043E\u043D\u0430 \u043F\u0440\u043E\u0434\u043E\u043B\u0436\u0430\u0435\u0442 \u0440\u0430\u0441\u0442\u0438 \u043A\u0430\u0436\u0434\u044B\u0439 \u043C\u0435\u0441\u044F\u0446")
25
+ }];
26
+ var ClientsAboutUsV2 = function ClientsAboutUsV2(_ref) {
27
+ var _ref$title = _ref.title,
28
+ title = _ref$title === void 0 ? "Клиенты о нас" : _ref$title,
29
+ _ref$blockquote = _ref.blockquote,
30
+ blockquote = _ref$blockquote === void 0 ? '"Тратили больше 50% рабочего времени на анализ конкурентов, из-за чего другие процессы тормозили"' : _ref$blockquote,
31
+ _ref$cite = _ref.cite,
32
+ cite = _ref$cite === void 0 ? "Андрей Краснов - индивидуальный предприниматель, селлер на Wildberries и OZON" : _ref$cite,
33
+ _ref$linkMain = _ref.linkMain,
34
+ linkMain = _ref$linkMain === void 0 ? 'https://lk.ecomru.ru' : _ref$linkMain;
35
+ var _useState = (0, _react.useState)(''),
36
+ _useState2 = _slicedToArray(_useState, 2),
37
+ refPage = _useState2[0],
38
+ setRefPage = _useState2[1];
39
+ (0, _react.useEffect)(function () {
40
+ var _window;
41
+ var currentUrl = (_window = window) === null || _window === void 0 || (_window = _window.location) === null || _window === void 0 ? void 0 : _window.href;
42
+ setRefPage("?ref_page=".concat(currentUrl));
43
+ }, []);
44
+ return /*#__PURE__*/_react["default"].createElement("section", {
45
+ className: "clients-about-us-v2"
46
+ }, title && /*#__PURE__*/_react["default"].createElement("h2", {
47
+ className: "clients-about-us-v2__title"
48
+ }, title), (blockquote || cite) && /*#__PURE__*/_react["default"].createElement("div", {
49
+ className: "clients-about-us-v2__header"
50
+ }, blockquote && /*#__PURE__*/_react["default"].createElement("blockquote", {
51
+ className: "clients-about-us-v2__blockquote"
52
+ }, blockquote), cite && /*#__PURE__*/_react["default"].createElement("cite", {
53
+ className: "clients-about-us-v2__cite"
54
+ }, cite)), /*#__PURE__*/_react["default"].createElement("div", {
55
+ className: "clients-about-us-v2__cards"
56
+ }, list_about_us.map(function (_ref2, ind) {
57
+ var title = _ref2.title,
58
+ description = _ref2.description,
59
+ btnName = _ref2.btnName;
60
+ var isRightCard = ind === 1;
61
+ return /*#__PURE__*/_react["default"].createElement("div", {
62
+ key: title + description,
63
+ className: isRightCard ? 'clients-about-us-v2__card clients-about-us-v2__card--dark' : 'clients-about-us-v2__card'
64
+ }, /*#__PURE__*/_react["default"].createElement("h3", {
65
+ className: "clients-about-us-v2__card-title"
66
+ }, title), /*#__PURE__*/_react["default"].createElement("div", {
67
+ className: "clients-about-us-v2__card-description"
68
+ }, description), isRightCard ? /*#__PURE__*/_react["default"].createElement("button", {
69
+ className: "clients-about-us-v2__card-btn clients-about-us-v2__card-btn--green",
70
+ onClick: function onClick() {
71
+ var _window2;
72
+ return (_window2 = window) === null || _window2 === void 0 ? void 0 : _window2.open("".concat(linkMain, "/auth").concat(refPage), '_blank');
73
+ }
74
+ }, btnName ? btnName : 'Подключиться', " \u2192") : /*#__PURE__*/_react["default"].createElement("button", {
75
+ className: "clients-about-us-v2__card-btn clients-about-us-v2__card-btn--outline",
76
+ onClick: function onClick() {
77
+ var _window3;
78
+ return (_window3 = window) === null || _window3 === void 0 ? void 0 : _window3.open("".concat(linkMain, "/auth").concat(refPage), '_blank');
79
+ }
80
+ }, btnName ? btnName : 'Подключиться', " \u2192"));
81
+ })));
82
+ };
83
+ var _default = exports["default"] = ClientsAboutUsV2;
@@ -0,0 +1,312 @@
1
+ @import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
2
+ @import '../variables.scss';
3
+
4
+ .clients-about-us-v2 {
5
+ padding: 96px 48px;
6
+ background: #FFFFFF;
7
+
8
+ * {
9
+ font-family: 'Manrope', 'Golos Text', sans-serif;
10
+ }
11
+
12
+ // Заголовок секции
13
+ &__title {
14
+ font-size: 30px;
15
+ font-weight: 800;
16
+ letter-spacing: -0.5px;
17
+ text-align: center;
18
+ margin-bottom: 16px;
19
+ color: #1A1A2E;
20
+ }
21
+
22
+ // Блок с цитатой
23
+ &__header {
24
+ text-align: center;
25
+ max-width: 800px;
26
+ margin: 0 auto 48px;
27
+ }
28
+
29
+ &__blockquote {
30
+ font-size: 18px;
31
+ font-weight: 600;
32
+ line-height: 1.4;
33
+ color: #1A1A2E;
34
+ margin-bottom: 12px;
35
+ quotes: none;
36
+ }
37
+
38
+ &__cite {
39
+ font-size: 14px;
40
+ color: #6B7280;
41
+ font-style: normal;
42
+ display: block;
43
+ }
44
+
45
+ // Карточки
46
+ &__cards {
47
+ max-width: 1280px;
48
+ margin: 0 auto;
49
+ display: grid;
50
+ grid-template-columns: repeat(2, 1fr);
51
+ gap: 24px;
52
+ }
53
+
54
+ &__card {
55
+ background: #F7F8FC;
56
+ border-radius: 20px;
57
+ padding: 32px;
58
+ border: 1px solid #E5E7EB;
59
+ transition: transform 0.2s ease, box-shadow 0.2s ease;
60
+ display: flex;
61
+ flex-direction: column;
62
+
63
+ &:hover {
64
+ transform: translateY(-4px);
65
+ box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
66
+ }
67
+
68
+ &--dark {
69
+ background: linear-gradient(135deg, #1A1A2E 0%, #064E3B 100%);
70
+ border: none;
71
+
72
+ .clients-about-us-v2__card-title {
73
+ color: #FFFFFF;
74
+ }
75
+
76
+ .clients-about-us-v2__card-description {
77
+ color: rgba(255, 255, 255, 0.8);
78
+ }
79
+ }
80
+ }
81
+
82
+ &__card-title {
83
+ font-size: 20px;
84
+ font-weight: 700;
85
+ margin-bottom: 20px;
86
+ color: #1A1A2E;
87
+ }
88
+
89
+ &__card-description {
90
+ font-size: 14px;
91
+ line-height: 1.6;
92
+ color: #4B5563;
93
+ margin-bottom: 28px;
94
+ flex: 1;
95
+
96
+ br {
97
+ display: block;
98
+ content: "";
99
+ margin-top: 4px;
100
+ }
101
+ }
102
+
103
+ // Кнопки
104
+ &__card-btn {
105
+ display: inline-flex;
106
+ align-items: center;
107
+ justify-content: center;
108
+ gap: 8px;
109
+ padding: 12px 24px;
110
+ border-radius: 10px;
111
+ font-size: 14px;
112
+ font-weight: 600;
113
+ cursor: pointer;
114
+ transition: all 0.2s ease;
115
+ font-family: 'Manrope', sans-serif;
116
+ width: fit-content;
117
+ min-width: 160px;
118
+
119
+ &--green {
120
+ background: #059669;
121
+ color: #FFFFFF;
122
+ border: none;
123
+
124
+ &:hover {
125
+ background: #047857;
126
+ transform: translateY(-2px);
127
+ box-shadow: 0 4px 16px rgba(5, 150, 105, 0.35);
128
+ }
129
+ }
130
+
131
+ &--outline {
132
+ background: transparent;
133
+ color: #059669;
134
+ border: 1.5px solid #059669;
135
+
136
+ &:hover {
137
+ background: #D1FAE5;
138
+ transform: translateY(-2px);
139
+ }
140
+ }
141
+
142
+ &:active {
143
+ transform: translateY(0);
144
+ }
145
+ }
146
+ }
147
+
148
+ // ========== МОБИЛЬНАЯ АДАПТАЦИЯ ==========
149
+
150
+ @media (max-width: 900px) {
151
+ .clients-about-us-v2 {
152
+ padding: 70px 32px;
153
+
154
+ &__cards {
155
+ gap: 20px;
156
+ }
157
+
158
+ &__card {
159
+ padding: 28px;
160
+ }
161
+
162
+ &__card-title {
163
+ font-size: 18px;
164
+ }
165
+
166
+ &__card-description {
167
+ font-size: 13px;
168
+ }
169
+ }
170
+ }
171
+
172
+ @media (max-width: 768px) {
173
+ .clients-about-us-v2 {
174
+ padding: 60px 24px;
175
+
176
+ &__title {
177
+ font-size: 26px;
178
+ }
179
+
180
+ &__blockquote {
181
+ font-size: 16px;
182
+ }
183
+
184
+ &__cards {
185
+ grid-template-columns: 1fr;
186
+ gap: 24px;
187
+ }
188
+
189
+ &__card {
190
+ padding: 28px 24px;
191
+ }
192
+
193
+ &__card-title {
194
+ font-size: 18px;
195
+ margin-bottom: 16px;
196
+ }
197
+
198
+ &__card-description {
199
+ font-size: 13px;
200
+ margin-bottom: 24px;
201
+ }
202
+
203
+ &__card-btn {
204
+ padding: 10px 20px;
205
+ font-size: 13px;
206
+ min-width: 140px;
207
+ }
208
+ }
209
+ }
210
+
211
+ @media (max-width: 600px) {
212
+ .clients-about-us-v2 {
213
+ padding: 48px 20px;
214
+
215
+ &__title {
216
+ font-size: 24px;
217
+ margin-bottom: 12px;
218
+ }
219
+
220
+ &__header {
221
+ margin-bottom: 36px;
222
+ }
223
+
224
+ &__blockquote {
225
+ font-size: 15px;
226
+ }
227
+
228
+ &__cite {
229
+ font-size: 13px;
230
+ }
231
+
232
+ &__card {
233
+ padding: 24px 20px;
234
+ }
235
+ }
236
+ }
237
+
238
+ @media (max-width: 480px) {
239
+ .clients-about-us-v2 {
240
+ padding: 40px 16px;
241
+
242
+ &__title {
243
+ font-size: 22px;
244
+ }
245
+
246
+ &__blockquote {
247
+ font-size: 14px;
248
+ }
249
+
250
+ &__cards {
251
+ gap: 20px;
252
+ }
253
+
254
+ &__card {
255
+ padding: 20px 16px;
256
+ border-radius: 16px;
257
+ }
258
+
259
+ &__card-title {
260
+ font-size: 16px;
261
+ margin-bottom: 14px;
262
+ }
263
+
264
+ &__card-description {
265
+ font-size: 12px;
266
+ line-height: 1.5;
267
+ margin-bottom: 20px;
268
+ }
269
+
270
+ &__card-btn {
271
+ padding: 10px 18px;
272
+ font-size: 13px;
273
+ min-width: 130px;
274
+ width: 100%;
275
+ }
276
+ }
277
+ }
278
+
279
+ @media (max-width: 375px) {
280
+ .clients-about-us-v2 {
281
+ padding: 32px 12px;
282
+
283
+ &__title {
284
+ font-size: 20px;
285
+ }
286
+
287
+ &__blockquote {
288
+ font-size: 13px;
289
+ }
290
+
291
+ &__cite {
292
+ font-size: 12px;
293
+ }
294
+
295
+ &__card {
296
+ padding: 18px 14px;
297
+ }
298
+
299
+ &__card-title {
300
+ font-size: 15px;
301
+ }
302
+
303
+ &__card-description {
304
+ font-size: 12px;
305
+ }
306
+
307
+ &__card-btn {
308
+ padding: 8px 16px;
309
+ font-size: 12px;
310
+ }
311
+ }
312
+ }
@@ -0,0 +1,25 @@
1
+ "use strict";
2
+
3
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports["default"] = exports.ClientsAboutUsV2Test = void 0;
8
+ var _react = _interopRequireWildcard(require("react"));
9
+ var _ClientsAboutUsV = _interopRequireDefault(require("./ClientsAboutUsV2"));
10
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
11
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
12
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
13
+ // import { CenterElement } from '../../../../.storybook/decorators';
14
+ // import { withRouter } from 'storybook-addon-react-router-v6'
15
+ var _default = exports["default"] = {
16
+ title: 'ClientsAboutUsV2',
17
+ component: _ClientsAboutUsV["default"]
18
+ // decorators: [
19
+ // CenterElement,
20
+ // withRouter
21
+ // ]
22
+ };
23
+ var ClientsAboutUsV2Test = exports.ClientsAboutUsV2Test = function ClientsAboutUsV2Test() {
24
+ return /*#__PURE__*/_react["default"].createElement(_ClientsAboutUsV["default"], null);
25
+ };