ecomlab-components-next 0.1.328 → 0.1.329
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.
|
@@ -144,7 +144,11 @@ var CardsServicesV2 = function CardsServicesV2(_ref) {
|
|
|
144
144
|
}
|
|
145
145
|
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
146
146
|
className: "cards-services-v2__card"
|
|
147
|
-
},
|
|
147
|
+
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
148
|
+
className: "cards-services-v2__frame"
|
|
149
|
+
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
150
|
+
className: "cards-services-v2__frame-bar"
|
|
151
|
+
}), hasImage ? /*#__PURE__*/_react["default"].createElement("img", {
|
|
148
152
|
decoding: "async",
|
|
149
153
|
loading: "lazy",
|
|
150
154
|
alt: label,
|
|
@@ -154,13 +158,17 @@ var CardsServicesV2 = function CardsServicesV2(_ref) {
|
|
|
154
158
|
className: "cards-services-v2__placeholder"
|
|
155
159
|
}, /*#__PURE__*/_react["default"].createElement("span", {
|
|
156
160
|
className: "cards-services-v2__placeholder-text"
|
|
157
|
-
}, firstLetter)), /*#__PURE__*/_react["default"].createElement("h3", {
|
|
161
|
+
}, firstLetter))), /*#__PURE__*/_react["default"].createElement("h3", {
|
|
158
162
|
className: "cards-services-v2__card-title"
|
|
159
163
|
}, label), /*#__PURE__*/_react["default"].createElement("p", {
|
|
160
164
|
className: "cards-services-v2__card-description"
|
|
161
|
-
}, description), /*#__PURE__*/_react["default"].createElement("
|
|
165
|
+
}, description), /*#__PURE__*/_react["default"].createElement(_ButtonBasicV["default"], {
|
|
166
|
+
width: "100%",
|
|
167
|
+
white: true,
|
|
168
|
+
text: 'Подробнее →'
|
|
169
|
+
}), /*#__PURE__*/_react["default"].createElement("span", {
|
|
162
170
|
className: "cards-services-v2__card-link-text"
|
|
163
|
-
}
|
|
171
|
+
})));
|
|
164
172
|
})), isShowButton && /*#__PURE__*/_react["default"].createElement(_ButtonBasicV["default"], {
|
|
165
173
|
className: 'cards-services-v2__button reveal',
|
|
166
174
|
green: true,
|
|
@@ -67,12 +67,47 @@
|
|
|
67
67
|
}
|
|
68
68
|
}
|
|
69
69
|
|
|
70
|
+
// Рамка для скрина: окно браузера
|
|
71
|
+
&__frame {
|
|
72
|
+
width: 100%;
|
|
73
|
+
margin-bottom: 16px;
|
|
74
|
+
overflow: hidden;
|
|
75
|
+
background: $white;
|
|
76
|
+
border: 1px solid #e2e5ea;
|
|
77
|
+
border-radius: 12px;
|
|
78
|
+
box-shadow: 0 10px 24px -8px rgba(15, 23, 42, 0.25);
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
&__frame-bar {
|
|
82
|
+
position: relative;
|
|
83
|
+
height: 26px;
|
|
84
|
+
background-color: #f1f3f6;
|
|
85
|
+
border-bottom: 1px solid #e5e7eb;
|
|
86
|
+
background-image:
|
|
87
|
+
radial-gradient(circle, #f87171 3px, transparent 4px),
|
|
88
|
+
radial-gradient(circle, #fbbf24 3px, transparent 4px),
|
|
89
|
+
radial-gradient(circle, #34d399 3px, transparent 4px);
|
|
90
|
+
background-size: 16px 26px;
|
|
91
|
+
background-repeat: no-repeat;
|
|
92
|
+
background-position: 10px 0, 26px 0, 42px 0;
|
|
93
|
+
|
|
94
|
+
// адресная строка
|
|
95
|
+
&::after {
|
|
96
|
+
content: '';
|
|
97
|
+
position: absolute;
|
|
98
|
+
left: 62px;
|
|
99
|
+
right: 10px;
|
|
100
|
+
top: 8px;
|
|
101
|
+
height: 10px;
|
|
102
|
+
border-radius: 5px;
|
|
103
|
+
background: #e2e5ea;
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
|
|
70
107
|
&__img {
|
|
71
108
|
width: 100%;
|
|
72
109
|
height: auto;
|
|
73
110
|
display: block;
|
|
74
|
-
border-radius: 12px;
|
|
75
|
-
margin-bottom: 16px;
|
|
76
111
|
object-fit: cover;
|
|
77
112
|
aspect-ratio: 1 / 0.8;
|
|
78
113
|
}
|
|
@@ -81,11 +116,9 @@
|
|
|
81
116
|
width: 100%;
|
|
82
117
|
aspect-ratio: 1 / 0.8;
|
|
83
118
|
background: $green-light-bg;
|
|
84
|
-
border-radius: 12px;
|
|
85
119
|
display: flex;
|
|
86
120
|
align-items: center;
|
|
87
121
|
justify-content: center;
|
|
88
|
-
margin-bottom: 16px;
|
|
89
122
|
}
|
|
90
123
|
|
|
91
124
|
&__placeholder-text {
|
|
@@ -229,13 +262,7 @@
|
|
|
229
262
|
align-items: center;
|
|
230
263
|
}
|
|
231
264
|
|
|
232
|
-
&
|
|
233
|
-
max-width: 280px;
|
|
234
|
-
margin-left: auto;
|
|
235
|
-
margin-right: auto;
|
|
236
|
-
}
|
|
237
|
-
|
|
238
|
-
&__placeholder {
|
|
265
|
+
&__frame {
|
|
239
266
|
max-width: 280px;
|
|
240
267
|
margin-left: auto;
|
|
241
268
|
margin-right: auto;
|
|
@@ -299,4 +326,4 @@
|
|
|
299
326
|
max-width: 100% !important;
|
|
300
327
|
}
|
|
301
328
|
}
|
|
302
|
-
}
|
|
329
|
+
}
|