ecomlab-components-next 0.1.257 → 0.1.259

package/dist/components/ConstructorComponents/SmartReplies/SmartReplies.scss

@@ -1,17 +1,15 @@
 @import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
 @import '../variables.scss';
 
-$text: #1A1A2E;
-$muted: #6B7280;
-$border: #E5E7EB;
-$bg: #F7F8FC;
-$white: #FFFFFF;
-
 .smart-replies {
     font-family: 'Manrope', sans-serif;
     background: $white;
     width: 100%;
-    padding: 96px 48px;
+    padding: 96px 40px;
+
+    * {
+        font-family: 'Manrope', 'Golos Text', sans-serif !important;
+    }
 
     &__inner {
         max-width: 1280px;
@@ -183,75 +181,50 @@ $white: #FFFFFF;
         }
     }
 
-    // ========== МОБИЛЬНАЯ АДАПТАЦИЯ ==========
-
-    @media (max-width: 1024px) {
-        padding: 72px 32px;
-    }
-
-    @media (max-width: 900px) {
-        &__grid {
-            grid-template-columns: 1fr;
-            gap: 20px;
+    @keyframes fadeUp {
+        from {
+            opacity: 0;
+            transform: translateY(24px);
+        }
+        to {
+            opacity: 1;
+            transform: translateY(0);
         }
     }
+}
 
-    @media (max-width: 768px) {
-        padding: 60px 24px;
+// Планшет (до 1100px)
+@media (max-width: 1100px) {
+    .smart-replies {
+        padding: 72px 24px;
 
         &__title {
             font-size: 26px;
         }
 
-        &__subtitle {
-            font-size: 14px;
-            margin-bottom: 40px;
-        }
-
-        &__card {
-            padding: 20px;
-        }
-
-        &__show-more {
-            margin-top: 40px;
+        &__grid {
+            grid-template-columns: 1fr;
+            gap: 20px;
         }
     }
+}
 
-    @media (max-width: 600px) {
-        padding: 48px 20px;
-    }
-
-    @media (max-width: 500px) {
-        padding: 48px 16px;
+// Мобильная версия (до 430px)
+@media (max-width: 430px) {
+    .smart-replies {
+        padding: 40px 20px;
 
         &__title {
-            font-size: 24px;
+            font-size: 22px;
         }
 
         &__subtitle {
             font-size: 13px;
+            margin-bottom: 32px;
         }
 
-        &__card-header {
-            flex-direction: column;
-            align-items: flex-start;
-        }
-
-        &__show-more-btn {
-            padding: 10px 24px;
-            font-size: 14px;
-        }
-    }
-
-    @media (max-width: 375px) {
-        padding: 36px 12px;
-
-        &__title {
-            font-size: 22px;
-        }
-
-        &__subtitle {
-            font-size: 12px;
+        &__grid {
+            gap: 16px;
         }
 
         &__card {
@@ -266,5 +239,10 @@ $white: #FFFFFF;
         &__show-more {
             margin-top: 32px;
         }
+
+        &__show-more-btn {
+            padding: 10px 20px;
+            font-size: 13px;
+        }
     }
 }

package/dist/components/ConstructorComponents/StatisticCardV2/StatisticCardV2.js

@@ -14,9 +14,9 @@ var StatisticCardV2 = function StatisticCardV2(_ref) {
     _ref$reverse = _ref.reverse,
     reverse = _ref$reverse === void 0 ? false : _ref$reverse;
   return /*#__PURE__*/_react["default"].createElement("section", {
-    className: (0, _utils.classes)(_StatisticCardV2Module["default"], 'statistic2')
+    className: (0, _utils.classes)(_StatisticCardV2Module["default"], 'statistic-card-v2')
   }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: (0, _utils.classes)(_StatisticCardV2Module["default"], 'statistic2__cards')
+    className: (0, _utils.classes)(_StatisticCardV2Module["default"], 'statistic-card-v2__cards')
   }, list.map(function (_ref2) {
     var label = _ref2.label,
       sum = _ref2.sum,
@@ -24,15 +24,11 @@ var StatisticCardV2 = function StatisticCardV2(_ref) {
     if (label && sum) {
       return /*#__PURE__*/_react["default"].createElement("div", {
         key: label + sum,
-        className: (0, _utils.classes)(_StatisticCardV2Module["default"], 'statistic2__card'),
-        style: {
-          flexDirection: reverse ? 'column-reverse' : '',
-          justifyContent: !reverse ? 'flex-start' : 'flex-end'
-        }
+        className: (0, _utils.classes)(_StatisticCardV2Module["default"], 'statistic-card-v2__card', reverse ? 'statistic-card-v2__card_reverse' : 'statistic-card-v2__card_normal')
       }, /*#__PURE__*/_react["default"].createElement("span", {
-        className: (0, _utils.classes)(_StatisticCardV2Module["default"], 'statistic2__card_name')
+        className: (0, _utils.classes)(_StatisticCardV2Module["default"], 'statistic-card-v2__label')
       }, reverse ? sum === null || sum === void 0 ? void 0 : sum.toLocaleString() : label), /*#__PURE__*/_react["default"].createElement("span", {
-        className: (0, _utils.classes)(_StatisticCardV2Module["default"], 'statistic2__card_sum'),
+        className: (0, _utils.classes)(_StatisticCardV2Module["default"], 'statistic-card-v2__sum'),
         style: {
           color: color || ''
         }

package/dist/components/ConstructorComponents/StatisticCardV2/StatisticCardV2.module.scss

@@ -1,10 +1,10 @@
 @import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
 @import '../variables.scss';
 
-.statistic2 {
-    background: linear-gradient(135deg, #1A1A2E 0%, $green-dark 100%);
-    padding: 80px 48px;
+.statistic-card-v2 {
+    background: linear-gradient(135deg, $text 0%, $green-dark 100%);
     width: 100%;
+    padding: 96px 40px;
 
     * {
         font-family: 'Manrope', 'Golos Text', sans-serif !important;
@@ -23,132 +23,95 @@
         display: flex;
         flex-direction: column;
         gap: 8px;
+
+        &_reverse {
+            flex-direction: column-reverse;
+            justify-content: flex-end;
+        }
+
+        &_normal {
+            flex-direction: column;
+            justify-content: flex-start;
+        }
     }
 
-    &__card_sum {
+    &__sum {
         font-size: 52px;
         font-weight: 800;
         letter-spacing: -2px;
-        background: linear-gradient(135deg, #fff 0%, $green-light-bg 100%);
+        background: linear-gradient(135deg, $white 0%, $green-light-bg 100%);
         -webkit-background-clip: text;
         -webkit-text-fill-color: transparent;
         background-clip: text;
         line-height: 1.1;
     }
 
-    &__card_name {
+    &__label {
         font-size: 14px;
         color: rgba(255, 255, 255, 0.6);
         line-height: 1.4;
     }
-}
-
-// При reverse режиме (если нужно инвертированное отображение)
-.statistic2__card[style*="column-reverse"] {
-    .statistic2__card_sum {
-        margin-bottom: 0;
-    }
-
-    .statistic2__card_name {
-        margin-top: 0;
-    }
-}
 
-// ========== МОБИЛЬНАЯ АДАПТАЦИЯ ==========
-@media (max-width: 1024px) {
-    .statistic2 {
-        padding: 70px 32px;
-        
-        &__cards {
-            gap: 32px;
+    @keyframes fadeUp {
+        from {
+            opacity: 0;
+            transform: translateY(24px);
         }
-        
-        &__card_sum {
-            font-size: 46px;
-            letter-spacing: -1.5px;
-        }
-        
-        &__card_name {
-            font-size: 13px;
+        to {
+            opacity: 1;
+            transform: translateY(0);
         }
     }
 }
 
-@media (max-width: 768px) {
-    .statistic2 {
-        padding: 60px 24px;
-        
+// Планшет (до 1100px)
+@media (max-width: 1100px) {
+    .statistic-card-v2 {
+        padding: 72px 24px;
+
         &__cards {
             grid-template-columns: repeat(2, 1fr);
             gap: 32px;
         }
-        
-        &__card_sum {
-            font-size: 42px;
+
+        &__sum {
+            font-size: 46px;
             letter-spacing: -1.5px;
         }
-        
-        &__card_name {
+
+        &__label {
             font-size: 13px;
         }
     }
 }
 
-@media (max-width: 600px) {
-    .statistic2 {
-        padding: 50px 20px;
-        
-        &__cards {
-            gap: 28px;
-        }
-        
-        &__card_sum {
-            font-size: 38px;
-            letter-spacing: -1px;
-        }
-        
-        &__card_name {
-            font-size: 12px;
-        }
-    }
-}
 
+// Мобильная версия (до 480px) - 1 колонка
 @media (max-width: 480px) {
-    .statistic2 {
-        padding: 40px 16px;
-        
+    .statistic-card-v2 {
+      
         &__cards {
             grid-template-columns: 1fr;
             gap: 28px;
         }
-        
-        &__card_sum {
-            font-size: 44px;
-            letter-spacing: -1px;
-        }
-        
-        &__card_name {
-            font-size: 14px;
-            max-width: 260px;
-            margin: 0 auto;
-            line-height: 1.4;
-        }
     }
 }
 
-@media (max-width: 375px) {
-    .statistic2 {
-        padding: 32px 16px;
-        
+// Мобильная версия (до 430px)
+@media (max-width: 430px) {
+    .statistic-card-v2 {
+        padding: 40px 20px;
+
         &__cards {
             gap: 24px;
         }
-        
-        &__card_sum {
+
+        &__sum {
             font-size: 36px;
+            letter-spacing: -1px;
         }
-        
-        &__card_name {
+
+        &__label {
             font-size: 12px;
             max-width: 220px;
         }

package/dist/components/ConstructorComponents/StepsV2/StepsV2.js

@@ -49,38 +49,38 @@ var StepsV2 = function StepsV2(_ref) {
       return window.removeEventListener('resize', checkMobile);
     };
   }, []);
-  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("section", {
-    className: (0, _utils.classes)(_StepsV2Module["default"], "steps-section ".concat(className))
+  return /*#__PURE__*/_react["default"].createElement("section", {
+    className: (0, _utils.classes)(_StepsV2Module["default"], "steps-v2 ".concat(className))
   }, title && /*#__PURE__*/_react["default"].createElement("h3", {
-    className: (0, _utils.classes)(_StepsV2Module["default"], "steps__title")
+    className: (0, _utils.classes)(_StepsV2Module["default"], "steps-v2__title")
   }, title), /*#__PURE__*/_react["default"].createElement("div", {
-    className: (0, _utils.classes)(_StepsV2Module["default"], "steps__items")
+    className: (0, _utils.classes)(_StepsV2Module["default"], "steps-v2__items")
   }, list.map(function (_ref2, ind) {
     var stepTitle = _ref2.title,
       description = _ref2.description;
     if (!stepTitle) return null;
     return /*#__PURE__*/_react["default"].createElement("div", {
       key: stepTitle + description,
-      className: (0, _utils.classes)(_StepsV2Module["default"], "steps__item")
+      className: (0, _utils.classes)(_StepsV2Module["default"], "steps-v2__item")
     }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: (0, _utils.classes)(_StepsV2Module["default"], "steps__count")
+      className: (0, _utils.classes)(_StepsV2Module["default"], "steps-v2__count")
     }, ind + 1), isMobile ? /*#__PURE__*/_react["default"].createElement("div", {
-      className: (0, _utils.classes)(_StepsV2Module["default"], "steps__item-text")
+      className: (0, _utils.classes)(_StepsV2Module["default"], "steps-v2__item-text")
     }, stepTitle && /*#__PURE__*/_react["default"].createElement("h4", {
-      className: (0, _utils.classes)(_StepsV2Module["default"], "steps__title_step")
+      className: (0, _utils.classes)(_StepsV2Module["default"], "steps-v2__step-title")
     }, stepTitle), description && /*#__PURE__*/_react["default"].createElement("p", {
-      className: (0, _utils.classes)(_StepsV2Module["default"], "steps__description")
+      className: (0, _utils.classes)(_StepsV2Module["default"], "steps-v2__description")
     }, description)) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, stepTitle && /*#__PURE__*/_react["default"].createElement("h4", {
-      className: (0, _utils.classes)(_StepsV2Module["default"], "steps__title_step")
+      className: (0, _utils.classes)(_StepsV2Module["default"], "steps-v2__step-title")
     }, stepTitle), description && /*#__PURE__*/_react["default"].createElement("p", {
-      className: (0, _utils.classes)(_StepsV2Module["default"], "steps__description")
+      className: (0, _utils.classes)(_StepsV2Module["default"], "steps-v2__description")
     }, description)));
   })), /*#__PURE__*/_react["default"].createElement("button", {
-    className: (0, _utils.classes)(_StepsV2Module["default"], "steps__btn"),
+    className: (0, _utils.classes)(_StepsV2Module["default"], "steps-v2__button"),
     onClick: function onClick() {
       var _window2;
       return (_window2 = window) === null || _window2 === void 0 ? void 0 : _window2.open("".concat(linkMain, "/auth").concat(refPage), '_blank');
     }
-  }, "\u041F\u043E\u043F\u0440\u043E\u0431\u043E\u0432\u0430\u0442\u044C \u0431\u0435\u0441\u043F\u043B\u0430\u0442\u043D\u043E \u2192")));
+  }, "\u041F\u043E\u043F\u0440\u043E\u0431\u043E\u0432\u0430\u0442\u044C \u0431\u0435\u0441\u043F\u043B\u0430\u0442\u043D\u043E \u2192"));
 };
 var _default = exports["default"] = StepsV2;