zz-shopify-components 0.17.1-beta.0 → 0.17.1-beta.2
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/package.json
CHANGED
|
@@ -129,7 +129,7 @@
|
|
|
129
129
|
<div class="swiper-wrapper tw-w-full">
|
|
130
130
|
{% for banner in section.blocks %}
|
|
131
131
|
<div class='swiper-slide'>
|
|
132
|
-
<div class='media-box tw-relative tw-w-full tw-h-full tw-rounded-[10px] lg:tw-rounded-[16px] tw-overflow-hidden'>
|
|
132
|
+
<div class='media-box tw-relative tw-w-full tw-h-full tw-rounded-[10px] lg:tw-rounded-[16px] tw-overflow-hidden tw-bg-white'>
|
|
133
133
|
{% if banner.settings.video_pc != blank or banner.settings.video_url_pc != blank %}
|
|
134
134
|
{% if banner.settings.video_url_pc != blank %}
|
|
135
135
|
{% assign pc_video = banner.settings.video_url_pc %}
|
|
@@ -161,14 +161,14 @@
|
|
|
161
161
|
|
|
162
162
|
{% if banner.settings.btn_type == 'modal' and banner.settings.modal_id != blank %}
|
|
163
163
|
<div class='learn-more-button tw-absolute tw-font-medium tw-cursor-pointer max-lg:tw-bottom-[24px] lg:tw-bottom-[40px] tw-left-1/2 tw--translate-x-1/2 tw-text-white tw-rounded-[100px]
|
|
164
|
-
tw-text-[13px] lg:tw-text-[16px] tw-px-[20px] tw-py-[
|
|
164
|
+
tw-text-[13px] lg:tw-text-[16px] tw-px-[20px] tw-py-[6px] lg:tw-px-[24px] lg:tw-py-[10px]'
|
|
165
165
|
data-zz-modal-target="#{{ banner.settings.modal_id }}"
|
|
166
166
|
>
|
|
167
167
|
<span>{{ banner.settings.btn_text }}</span>
|
|
168
168
|
</div>
|
|
169
169
|
{% elsif banner.settings.btn_type == 'link' and banner.settings.btn_link != blank %}
|
|
170
170
|
<a class='learn-more-button tw-absolute tw-font-medium tw-cursor-pointer max-lg:tw-bottom-[24px] lg:tw-bottom-[40px] tw-left-1/2 tw--translate-x-1/2 tw-text-white tw-rounded-[100px]
|
|
171
|
-
tw-text-[13px] lg:tw-text-[16px] tw-px-[20px] tw-py-[
|
|
171
|
+
tw-text-[13px] lg:tw-text-[16px] tw-px-[20px] tw-py-[6px] lg:tw-px-[24px] lg:tw-py-[10px]'
|
|
172
172
|
href='{{ banner.settings.btn_link }}'>
|
|
173
173
|
<span>{{ banner.settings.btn_text }}</span>
|
|
174
174
|
</a>
|
|
@@ -213,14 +213,14 @@
|
|
|
213
213
|
|
|
214
214
|
{% if banner.settings.btn_type == 'modal' and banner.settings.modal_id != blank %}
|
|
215
215
|
<div class='learn-more-button tw-absolute tw-font-medium tw-cursor-pointer max-lg:tw-bottom-[24px] lg:tw-bottom-[40px] tw-left-1/2 tw--translate-x-1/2 tw-text-white tw-rounded-[100px]
|
|
216
|
-
tw-text-[13px] lg:tw-text-[16px] tw-px-[20px] tw-py-[
|
|
216
|
+
tw-text-[13px] lg:tw-text-[16px] tw-px-[20px] tw-py-[6px] lg:tw-px-[24px] lg:tw-py-[10px]'
|
|
217
217
|
data-zz-modal-target="#{{ banner.settings.modal_id }}"
|
|
218
218
|
>
|
|
219
219
|
<span>{{ banner.settings.btn_text }}</span>
|
|
220
220
|
</div>
|
|
221
221
|
{% elsif banner.settings.btn_type == 'link' and banner.settings.btn_link != blank %}
|
|
222
222
|
<a class='learn-more-button tw-absolute tw-font-medium tw-cursor-pointer max-lg:tw-bottom-[24px] lg:tw-bottom-[40px] tw-left-1/2 tw--translate-x-1/2 tw-text-white tw-rounded-[100px]
|
|
223
|
-
tw-text-[13px] lg:tw-text-[16px] tw-px-[20px] tw-py-[
|
|
223
|
+
tw-text-[13px] lg:tw-text-[16px] tw-px-[20px] tw-py-[6px] lg:tw-px-[24px] lg:tw-py-[10px]'
|
|
224
224
|
href='{{ banner.settings.btn_link }}'>
|
|
225
225
|
<span>{{ banner.settings.btn_text }}</span>
|
|
226
226
|
</a>
|
|
@@ -246,7 +246,7 @@
|
|
|
246
246
|
</div>
|
|
247
247
|
|
|
248
248
|
|
|
249
|
-
<div class="gallery-nav tw-w-full tw-flex tw-justify-center tw-items-end max-lg:tw-mt-[20px] lg:tw-mt-[40px] lg:w-gap-[18px] tw-gap-[8px]">
|
|
249
|
+
<div class="gallery-nav tw-w-full tw-flex tw-justify-center tw-items-end max-lg:tw-mt-[20px] lg:tw-mt-[40px] lg:tw-h-[90px] max-lg:tw-h-[80px] lg:w-gap-[18px] tw-gap-[8px]">
|
|
250
250
|
{% for banner in section.blocks %}
|
|
251
251
|
<div class='gallery-item tw-cursor-pointer lg:tw-w-[120px] lg:tw-h-[68px] max-lg:tw-w-[48px] max-lg:tw-h-[64px] tw-rounded-[4px] tw-overflow-hidden'>
|
|
252
252
|
{%
|
|
@@ -351,6 +351,9 @@
|
|
|
351
351
|
display: flex;
|
|
352
352
|
flex-direction: column;
|
|
353
353
|
align-items: center;
|
|
354
|
+
}
|
|
355
|
+
#shopify-section-{{section.id}} .gallery-item {
|
|
356
|
+
transition: width 0.3s ease, height 0.3s ease;
|
|
354
357
|
}
|
|
355
358
|
#shopify-section-{{section.id}} .width-height-full {
|
|
356
359
|
width: 100% !important;
|
|
@@ -360,7 +363,12 @@
|
|
|
360
363
|
backdrop-filter: blur(10px);
|
|
361
364
|
background-color: rgba(255, 255, 255, 0.2);
|
|
362
365
|
cursor: pointer;
|
|
366
|
+
display: none;
|
|
363
367
|
}
|
|
368
|
+
#shopify-section-{{section.id}} .swiper-slide-active .learn-more-button {
|
|
369
|
+
display: block;
|
|
370
|
+
}
|
|
371
|
+
|
|
364
372
|
#shopify-section-{{section.id}} .swiper-button-next:after,
|
|
365
373
|
#shopify-section-{{section.id}} .swiper-button-prev:after {
|
|
366
374
|
display: none;
|