ecomlab-components-next 0.1.256 → 0.1.259

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 (31) hide show
  1. package/dist/components/ConstructorComponents/ArticlesBlockV2/ArticlesBlockV2.module.scss +99 -181
  2. package/dist/components/ConstructorComponents/BlocksInfoV2/BlocksInfoV2.js +24 -33
  3. package/dist/components/ConstructorComponents/BlocksInfoV2/BlocksInfoV2.scss +208 -194
  4. package/dist/components/ConstructorComponents/CardsServicesV2/CardsServicesV2.js +1 -3
  5. package/dist/components/ConstructorComponents/CardsServicesV2/CardsServicesV2.scss +103 -127
  6. package/dist/components/ConstructorComponents/CardsV2/CardsV2.js +10 -11
  7. package/dist/components/ConstructorComponents/CardsV2/CardsV2.scss +162 -158
  8. package/dist/components/ConstructorComponents/CardsWithButton/CardsWithButton.js +8 -8
  9. package/dist/components/ConstructorComponents/CardsWithButton/CardsWithButton.scss +33 -54
  10. package/dist/components/ConstructorComponents/ClientsAboutUsV2/ClientsAboutUsV2.js +11 -11
  11. package/dist/components/ConstructorComponents/ClientsAboutUsV2/ClientsAboutUsV2.scss +86 -168
  12. package/dist/components/ConstructorComponents/FeaturesGridV2/FeaturesGridV2.js +13 -13
  13. package/dist/components/ConstructorComponents/FeaturesGridV2/FeaturesGridV2.scss +140 -110
  14. package/dist/components/ConstructorComponents/FormV2/FormV2.js +4 -4
  15. package/dist/components/ConstructorComponents/FormV2/FormV2.scss +28 -43
  16. package/dist/components/ConstructorComponents/LogosStrip/LogosStrip.js +9 -9
  17. package/dist/components/ConstructorComponents/LogosStrip/LogosStrip.scss +30 -43
  18. package/dist/components/ConstructorComponents/MarqueImgsV2/MarqueImgsV2.scss +1 -1
  19. package/dist/components/ConstructorComponents/PhoneBlockV2/PhoneBlockV2.js +8 -8
  20. package/dist/components/ConstructorComponents/PhoneBlockV2/PhoneBlockV2.scss +53 -77
  21. package/dist/components/ConstructorComponents/PointsListV2/PointsListV2.scss +56 -42
  22. package/dist/components/ConstructorComponents/QuestionsV2/QuestionsV2.js +12 -12
  23. package/dist/components/ConstructorComponents/QuestionsV2/QuestionsV2.scss +47 -45
  24. package/dist/components/ConstructorComponents/SmartReplies/SmartReplies.scss +35 -57
  25. package/dist/components/ConstructorComponents/StatisticCardV2/StatisticCardV2.js +5 -9
  26. package/dist/components/ConstructorComponents/StatisticCardV2/StatisticCardV2.module.scss +46 -83
  27. package/dist/components/ConstructorComponents/StepsV2/StepsV2.js +13 -13
  28. package/dist/components/ConstructorComponents/StepsV2/StepsV2.module.scss +184 -184
  29. package/dist/components/ConstructorComponents/VideoBlockV2/VideoBlockV2.scss +26 -28
  30. package/dist/components/ConstructorComponents/variables.scss +1 -1
  31. package/package.json +1 -1
@@ -3,212 +3,130 @@
3
3
 
4
4
  .articles-v2 {
5
5
  font-family: 'Manrope', sans-serif;
6
- background: var(--bg, #F7F8FC);
6
+ background: $bg;
7
7
  width: 100%;
8
- padding: 96px 48px;
8
+ padding: 96px 40px;
9
9
 
10
- * {
10
+ * {
11
11
  font-family: 'Manrope', 'Golos Text', sans-serif !important;
12
12
  }
13
- }
14
-
15
- .articles-v2__inner {
16
- max-width: 1280px;
17
- margin: 0 auto;
18
- display: flex;
19
- flex-direction: column;
20
- gap: 56px;
21
- }
22
13
 
23
- /* ── Header (центрированный) ── */
24
- .articles-v2__header {
25
- text-align: center;
26
- width: 100%;
27
- }
28
-
29
- .articles-v2__header-left {
30
- display: flex;
31
- flex-direction: column;
32
- gap: 12px;
33
- align-items: center;
34
- }
35
-
36
- .articles-v2__title {
37
- font-size: 30px;
38
- font-weight: 800;
39
- letter-spacing: -0.5px;
40
- color: var(--text, #1A1A2E);
41
- margin: 0;
42
- }
43
-
44
- .articles-v2__subtitle {
45
- font-size: 15px;
46
- color: var(--muted, #6B7280);
47
- line-height: 1.5;
48
- max-width: 440px;
49
- margin: 0;
50
- }
51
-
52
- /* ── Grid (3 колонки, карточки переносятся) ── */
53
- .articles-v2__grid {
54
- display: flex;
55
- flex-wrap: wrap;
56
- gap: 32px;
57
- justify-content: center;
58
- }
59
-
60
- /* Карточки — фиксированная ширина, не сужаются */
61
- .articles-v2__grid > * {
62
- background: #fff;
63
- border: 1px solid #E5E7EB;
64
- border-radius: 20px;
65
- padding: 32px 28px 36px;
66
- display: flex;
67
- flex-direction: column;
68
- transition: transform 0.2s ease, box-shadow 0.2s ease;
69
- border-top: 3px solid $green;
70
- width: calc(33.333% - 22px);
71
- min-width: 280px;
72
- flex: 1 1 auto;
73
-
74
- &:hover {
75
- transform: translateY(-4px);
76
- box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
14
+ &__inner {
15
+ max-width: 1280px;
16
+ margin: 0 auto;
17
+ display: flex;
18
+ flex-direction: column;
19
+ gap: 56px;
77
20
  }
78
- }
79
-
80
- /* ========== МОБИЛЬНАЯ ВЕРСТКА (перенос карточек) ========== */
81
21
 
82
- /* Планшеты — 2 колонки */
83
- @media (max-width: 1024px) {
84
- .articles-v2 {
85
- padding: 72px 32px;
22
+ &__header {
23
+ text-align: center;
24
+ width: 100%;
86
25
  }
87
26
 
88
- .articles-v2__grid > * {
89
- width: calc(50% - 16px);
90
- min-width: 260px;
27
+ &__header-left {
28
+ display: flex;
29
+ flex-direction: column;
30
+ gap: 12px;
31
+ align-items: center;
91
32
  }
92
33
 
93
- .articles-v2__title {
94
- font-size: 28px;
95
- }
96
-
97
- .articles-v2__subtitle {
98
- font-size: 14px;
99
- }
100
-
101
- .articles-v2__grid {
102
- gap: 24px;
34
+ &__title {
35
+ font-size: 30px;
36
+ font-weight: 800;
37
+ letter-spacing: -0.5px;
38
+ color: $text;
39
+ margin: 0;
103
40
  }
104
- }
105
41
 
106
- /* Маленькие планшеты */
107
- @media (max-width: 768px) {
108
- .articles-v2 {
109
- padding: 60px 24px;
110
- }
111
-
112
- .articles-v2__inner {
113
- gap: 40px;
42
+ &__subtitle {
43
+ font-size: 15px;
44
+ color: $muted;
45
+ line-height: 1.5;
46
+ max-width: 440px;
47
+ margin: 0;
114
48
  }
115
-
116
- .articles-v2__title {
117
- font-size: 26px;
118
- }
119
-
120
- .articles-v2__grid {
121
- gap: 20px;
122
- }
123
-
124
- .articles-v2__grid > * {
125
- width: calc(50% - 10px);
126
- min-width: 250px;
127
- padding: 24px 20px 28px;
49
+
50
+ &__grid {
51
+ display: flex;
52
+ flex-wrap: wrap;
53
+ gap: 32px;
54
+ justify-content: center;
55
+ }
56
+
57
+ &__grid > * {
58
+ background: $white;
59
+ border: 1px solid $border;
60
+ border-radius: 20px;
61
+ padding: 12px;
62
+ display: flex;
63
+ flex-direction: column;
64
+ transition: transform 0.2s ease, box-shadow 0.2s ease;
65
+ border-top: 3px solid $green;
66
+ width: calc(33.333% - 22px);
67
+ min-width: 280px;
68
+ flex: 1 1 auto;
69
+
70
+ &:hover {
71
+ transform: translateY(-4px);
72
+ box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
73
+ }
74
+ }
75
+
76
+ @keyframes fadeUp {
77
+ from {
78
+ opacity: 0;
79
+ transform: translateY(24px);
80
+ }
81
+ to {
82
+ opacity: 1;
83
+ transform: translateY(0);
84
+ }
128
85
  }
129
86
  }
130
87
 
131
- /* Мобильные устройства — 1 колонка */
132
- @media (max-width: 600px) {
88
+ // Планшет (до 1100px)
89
+ @media (max-width: 1100px) {
133
90
  .articles-v2 {
134
- padding: 48px 20px;
135
- }
136
-
137
- .articles-v2__inner {
138
- gap: 32px;
139
- }
140
-
141
- .articles-v2__title {
142
- font-size: 24px;
143
- }
144
-
145
- .articles-v2__subtitle {
146
- font-size: 14px;
147
- max-width: 100%;
148
- }
149
-
150
- .articles-v2__grid {
151
- gap: 16px;
152
- }
153
-
154
- .articles-v2__grid > * {
155
- width: 100%;
156
- min-width: auto;
157
- padding: 20px 18px 24px;
91
+ padding: 72px 24px;
92
+
93
+ &__title {
94
+ font-size: 26px;
95
+ }
96
+
97
+ &__subtitle {
98
+ font-size: 14px;
99
+ }
100
+
101
+ &__grid {
102
+ gap: 24px;
103
+ }
158
104
  }
159
105
  }
160
106
 
161
- /* Маленькие телефоны */
162
- @media (max-width: 480px) {
107
+ // Планшет (до 1024px) - 2 колонки
108
+ @media (max-width: 1024px) {
163
109
  .articles-v2 {
164
- padding: 40px 16px;
165
- }
166
-
167
- .articles-v2__inner {
168
- gap: 28px;
169
- }
170
-
171
- .articles-v2__title {
172
- font-size: 22px;
173
- }
174
-
175
- .articles-v2__subtitle {
176
- font-size: 13px;
177
- }
178
-
179
- .articles-v2__grid {
180
- gap: 14px;
181
- }
182
-
183
- .articles-v2__grid > * {
184
- padding: 18px 16px 20px;
185
- border-radius: 16px;
110
+ padding: 72px 24px;
111
+
112
+ &__grid > * {
113
+ width: calc(50% - 12px);
114
+ min-width: 260px;
115
+ }
186
116
  }
187
117
  }
188
118
 
189
- /* Самые маленькие экраны */
190
- @media (max-width: 375px) {
119
+ // Мобильная версия (до 430px)
120
+ @media (max-width: 430px) {
191
121
  .articles-v2 {
192
- padding: 32px 12px;
193
- }
194
-
195
- .articles-v2__inner {
196
- gap: 24px;
197
- }
198
-
199
- .articles-v2__title {
200
- font-size: 20px;
201
- }
202
-
203
- .articles-v2__subtitle {
204
- font-size: 12px;
205
- }
206
-
207
- .articles-v2__grid {
208
- gap: 12px;
209
- }
210
-
211
- .articles-v2__grid > * {
212
- padding: 16px 14px 18px;
122
+ padding: 40px 20px;
123
+
124
+ &__title {
125
+ font-size: 22px;
126
+ }
127
+
128
+ &__subtitle {
129
+ font-size: 13px;
130
+ }
213
131
  }
214
132
  }
@@ -95,7 +95,7 @@ var form_data_ECOMRU = [{
95
95
  required: true
96
96
  }];
97
97
  var BlocksInfo = function BlocksInfo(_ref) {
98
- var _window;
98
+ var _window, _window2;
99
99
  var title = _ref.title,
100
100
  subTitle = _ref.subTitle,
101
101
  _ref$list = _ref.list,
@@ -108,15 +108,12 @@ var BlocksInfo = function BlocksInfo(_ref) {
108
108
  isForm = _ref$isForm === void 0 ? false : _ref$isForm,
109
109
  _ref$onClick = _ref.onClick,
110
110
  onClick = _ref$onClick === void 0 ? null : _ref$onClick;
111
- var _useState = (0, _react.useState)(''),
111
+ var current_query = (_window = window) === null || _window === void 0 || (_window = _window.location) === null || _window === void 0 ? void 0 : _window.href;
112
+ var currentUrl = (_window2 = window) === null || _window2 === void 0 || (_window2 = _window2.location) === null || _window2 === void 0 ? void 0 : _window2.href;
113
+ var _useState = (0, _react.useState)(false),
112
114
  _useState2 = _slicedToArray(_useState, 2),
113
- refPage = _useState2[0],
114
- setRefPage = _useState2[1];
115
- var currentUrl = (_window = window) === null || _window === void 0 || (_window = _window.location) === null || _window === void 0 ? void 0 : _window.href;
116
- var _useState3 = (0, _react.useState)(false),
117
- _useState4 = _slicedToArray(_useState3, 2),
118
- isModal = _useState4[0],
119
- _setIsModal = _useState4[1];
115
+ isModal = _useState2[0],
116
+ _setIsModal = _useState2[1];
120
117
  var currentProps = function currentProps() {
121
118
  if (currentUrl !== null && currentUrl !== void 0 && currentUrl.includes('dotask.ru')) {
122
119
  return {
@@ -140,15 +137,10 @@ var BlocksInfo = function BlocksInfo(_ref) {
140
137
  } else if (onClick) {
141
138
  onClick();
142
139
  } else {
143
- var _window2;
144
- (_window2 = window) === null || _window2 === void 0 || _window2.open("".concat(linkMain, "/auth").concat(refPage), '_blank');
140
+ var _window3;
141
+ (_window3 = window) === null || _window3 === void 0 || _window3.open("".concat(linkMain, "/auth").concat(current_query), '_blank');
145
142
  }
146
143
  };
147
- (0, _react.useEffect)(function () {
148
- var _window3;
149
- var currentUrl = (_window3 = window) === null || _window3 === void 0 || (_window3 = _window3.location) === null || _window3 === void 0 ? void 0 : _window3.href;
150
- setRefPage("?ref_page=".concat(currentUrl));
151
- }, []);
152
144
  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, isModal && /*#__PURE__*/_react["default"].createElement(_ModalBitrixForm["default"], _extends({
153
145
  modal: true,
154
146
  setIsModal: function setIsModal(e) {
@@ -156,15 +148,17 @@ var BlocksInfo = function BlocksInfo(_ref) {
156
148
  },
157
149
  formTitle: 'Желаемый способ связи'
158
150
  }, currentProps())), /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("section", {
159
- className: "lbi2-root ".concat(className)
151
+ className: "blocks-info-v2 ".concat(className)
160
152
  }, /*#__PURE__*/_react["default"].createElement("div", {
161
- className: "lbi2-inner"
162
- }, (title || subTitle) && /*#__PURE__*/_react["default"].createElement("div", null, title && /*#__PURE__*/_react["default"].createElement("h2", {
163
- className: "lbi2-section-title"
153
+ className: "blocks-info-v2__inner"
154
+ }, (title || subTitle) && /*#__PURE__*/_react["default"].createElement("div", {
155
+ className: "blocks-info-v2__header"
156
+ }, title && /*#__PURE__*/_react["default"].createElement("h2", {
157
+ className: "blocks-info-v2__title"
164
158
  }, title), subTitle && /*#__PURE__*/_react["default"].createElement("p", {
165
- className: "lbi2-section-sub"
159
+ className: "blocks-info-v2__subtitle"
166
160
  }, subTitle)), /*#__PURE__*/_react["default"].createElement("div", {
167
- className: "lbi2-items"
161
+ className: "blocks-info-v2__items"
168
162
  }, list.map(function (_ref2, ind) {
169
163
  var label = _ref2.label,
170
164
  img = _ref2.img,
@@ -173,14 +167,11 @@ var BlocksInfo = function BlocksInfo(_ref) {
173
167
  var isReverse = ind % 2 === 0;
174
168
  return /*#__PURE__*/_react["default"].createElement("div", {
175
169
  key: label + ind,
176
- className: "lbi2-item ".concat(isReverse ? 'lbi2-item--reverse' : 'lbi2-item--normal'),
177
- style: {
178
- flexDirection: isReverse ? 'row-reverse' : 'row'
179
- }
170
+ className: "blocks-info-v2__item ".concat(isReverse ? 'blocks-info-v2__item_reverse' : 'blocks-info-v2__item_normal')
180
171
  }, /*#__PURE__*/_react["default"].createElement("div", {
181
- className: "lbi2-img-box"
172
+ className: "blocks-info-v2__image-box"
182
173
  }, /*#__PURE__*/_react["default"].createElement("img", {
183
- className: "lbi2-img",
174
+ className: "blocks-info-v2__image",
184
175
  loading: "lazy",
185
176
  decoding: "async",
186
177
  src: img || 'https://dl.ecomru.ru:9001/dev-images/3_12.png',
@@ -188,17 +179,17 @@ var BlocksInfo = function BlocksInfo(_ref) {
188
179
  }), !img && /*#__PURE__*/_react["default"].createElement("img", {
189
180
  loading: "lazy",
190
181
  decoding: "async",
191
- className: "lbi2-img-dev",
182
+ className: "blocks-info-v2__image-dev",
192
183
  src: "https://dl.ecomru.ru:9001/dev-images/frame_1321317238.png",
193
184
  alt: ""
194
185
  })), /*#__PURE__*/_react["default"].createElement("div", {
195
- className: "lbi2-info-box"
186
+ className: "blocks-info-v2__info"
196
187
  }, /*#__PURE__*/_react["default"].createElement("span", {
197
- className: "lbi2-badge"
188
+ className: "blocks-info-v2__badge"
198
189
  }, "0", ind + 1), label && /*#__PURE__*/_react["default"].createElement("h3", {
199
- className: "lbi2-title-card"
190
+ className: "blocks-info-v2__card-title"
200
191
  }, label), description && /*#__PURE__*/_react["default"].createElement("p", {
201
- className: "lbi2-description"
192
+ className: "blocks-info-v2__description"
202
193
  }, description), /*#__PURE__*/_react["default"].createElement(_ButtonBasicV["default"], {
203
194
  size: '52px',
204
195
  green: true,