zz-shopify-components 0.0.27 → 0.0.28-beta.10

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 (83) hide show
  1. package/CHANGELOG.md +21 -21
  2. package/README.md +70 -56
  3. package/assets/ScrollTrigger.min.js +11 -11
  4. package/assets/gsap.min.js +11 -11
  5. package/assets/jquery.js +2 -2
  6. package/assets/lazy-video.js +2 -2
  7. package/assets/lazyload.min.js +1 -1
  8. package/assets/lozad.js +10 -10
  9. package/assets/site-jump.js +52 -52
  10. package/assets/site-jumpV2.js +35 -35
  11. package/assets/swiper-bundle.min.css +12 -12
  12. package/assets/swiper-bundle.min.js +13 -13
  13. package/assets/swiper.css +330 -330
  14. package/assets/zz-components.css +322 -322
  15. package/assets/zz-components.js +166 -166
  16. package/assets/zz-fade-in-content.js +169 -169
  17. package/assets/zz-http-request.js +73 -73
  18. package/assets/zz-world-video-comments-dialog.js +240 -240
  19. package/assets/zz-world-video-dialog.js +190 -190
  20. package/assets/zz-world-video-list.js +317 -317
  21. package/assets/zz-world-video.js +270 -270
  22. package/blocks/zz-accessories-item.liquid +188 -188
  23. package/blocks/zz-accessories-swiper.liquid +223 -223
  24. package/blocks/zz-button.liquid +216 -216
  25. package/blocks/zz-content-description-html.liquid +201 -201
  26. package/blocks/zz-content-description.liquid +209 -209
  27. package/blocks/zz-flex-layout-bg-block.liquid +524 -524
  28. package/blocks/zz-flex-layout-block.liquid +549 -549
  29. package/blocks/zz-flex-layout-widget.liquid +321 -321
  30. package/blocks/zz-full-screen-swiper.liquid +443 -443
  31. package/blocks/zz-icon.liquid +46 -46
  32. package/blocks/zz-mail.liquid +135 -135
  33. package/blocks/zz-mb-swiper-pc-flex.liquid +273 -273
  34. package/blocks/zz-price-tag-mini.liquid +106 -106
  35. package/blocks/zz-price-tag.liquid +41 -41
  36. package/blocks/zz-ratio-image.liquid +181 -181
  37. package/blocks/zz-ratio-video.liquid +115 -115
  38. package/blocks/zz-responsive-width-image.liquid +222 -222
  39. package/blocks/zz-responsive-width-video.liquid +166 -166
  40. package/blocks/zz-scroll-animate-bg-text.liquid +268 -268
  41. package/blocks/zz-scroll-cover.liquid +67 -67
  42. package/blocks/zz-tag.liquid +50 -50
  43. package/blocks/zz-text.liquid +227 -227
  44. package/blocks/zz-title.liquid +287 -287
  45. package/blocks/zz-video-button.liquid +84 -84
  46. package/blocks/zz-video-img-item.liquid +203 -203
  47. package/blocks/zz-video-img-list.liquid +166 -166
  48. package/blocks/zz-video-swiper-perview-item.liquid +221 -221
  49. package/blocks/zz-video-swiper-perview.liquid +585 -585
  50. package/blocks/zz-world-video.liquid +639 -639
  51. package/component.config.json +7 -7
  52. package/package.json +1 -1
  53. package/scripts/postinstall-v1.js +39 -39
  54. package/scripts/postinstall-v2.js +47 -47
  55. package/scripts/postinstall-v3.js +51 -51
  56. package/scripts/publish-npm.js +43 -43
  57. package/sections/zz-flex-layout-section.liquid +269 -269
  58. package/sections/zz-navigation-tab-v3.liquid +409 -409
  59. package/sections/zz-navigation-tab.liquid +411 -411
  60. package/sections/zz-shopping-card-list.liquid +399 -399
  61. package/sections/zz-video-collapse-swiper.liquid +522 -522
  62. package/sections/zz-video-tab-swiper.liquid +748 -748
  63. package/snippets/zz-button.liquid +70 -70
  64. package/snippets/zz-content-h3.liquid +15 -15
  65. package/snippets/zz-content-text.liquid +56 -56
  66. package/snippets/zz-h2.liquid +31 -31
  67. package/snippets/zz-h3.liquid +31 -31
  68. package/snippets/zz-h4.liquid +30 -30
  69. package/snippets/zz-h5.liquid +39 -39
  70. package/snippets/zz-h6.liquid +39 -39
  71. package/snippets/zz-icon-next.liquid +17 -17
  72. package/snippets/zz-icon-prev.liquid +17 -17
  73. package/snippets/zz-icon.liquid +74 -74
  74. package/snippets/zz-img-md.liquid +44 -44
  75. package/snippets/zz-img.liquid +44 -44
  76. package/snippets/zz-prev-next-blur-icon.liquid +36 -36
  77. package/snippets/zz-prev-next-btn.liquid +62 -62
  78. package/snippets/zz-price-tag.liquid +22 -22
  79. package/snippets/zz-spoke.liquid +142 -142
  80. package/snippets/zz-tag.liquid +22 -22
  81. package/snippets/zz-video-button.liquid +54 -54
  82. package/snippets/zz-video-md.liquid +117 -117
  83. package/snippets/zz-video.liquid +117 -117
@@ -1,17 +1,17 @@
1
- <svg
2
- width='48'
3
- height='49'
4
- viewBox='0 0 48 49'
5
- fill='none'
6
- xmlns='http://www.w3.org/2000/svg'
7
- >
8
- <rect x="0.5" y="0.904297" width="47" height="47" rx="23.5" fill="white" fill-opacity="0.06" stroke="url(#paint0_linear_7505_5866)"/>
9
- <path fill-rule="evenodd" clip-rule="evenodd" d="M29 24.4043L21.9289 17.3332L21.9392 19.5192L26.8243 24.4043L21.9289 29.2761L21.9289 31.4754L29 24.4043Z" fill="white"/>
10
- <defs>
11
- <linearGradient id="paint0_linear_7505_5866" x1="4.63636" y1="9.4043" x2="48.3522" y2="18.0623" gradientUnits="userSpaceOnUse">
12
- <stop stop-color="white" stop-opacity="0.2"/>
13
- <stop offset="0.468859" stop-color="white" stop-opacity="0.15"/>
14
- <stop offset="1" stop-color="white" stop-opacity="0.4"/>
15
- </linearGradient>
16
- </defs>
17
- </svg>
1
+ <svg
2
+ width='48'
3
+ height='49'
4
+ viewBox='0 0 48 49'
5
+ fill='none'
6
+ xmlns='http://www.w3.org/2000/svg'
7
+ >
8
+ <rect x="0.5" y="0.904297" width="47" height="47" rx="23.5" fill="white" fill-opacity="0.06" stroke="url(#paint0_linear_7505_5866)"/>
9
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M29 24.4043L21.9289 17.3332L21.9392 19.5192L26.8243 24.4043L21.9289 29.2761L21.9289 31.4754L29 24.4043Z" fill="white"/>
10
+ <defs>
11
+ <linearGradient id="paint0_linear_7505_5866" x1="4.63636" y1="9.4043" x2="48.3522" y2="18.0623" gradientUnits="userSpaceOnUse">
12
+ <stop stop-color="white" stop-opacity="0.2"/>
13
+ <stop offset="0.468859" stop-color="white" stop-opacity="0.15"/>
14
+ <stop offset="1" stop-color="white" stop-opacity="0.4"/>
15
+ </linearGradient>
16
+ </defs>
17
+ </svg>
@@ -1,17 +1,17 @@
1
- <svg
2
- width='48'
3
- height='49'
4
- viewBox='0 0 48 49'
5
- fill='none'
6
- xmlns='http://www.w3.org/2000/svg'
7
- >
8
- <rect x="0.5" y="0.904297" width="47" height="47" rx="23.5" fill="white" fill-opacity="0.06" stroke="url(#paint0_linear_7489_5863)"/>
9
- <path fill-rule="evenodd" clip-rule="evenodd" d="M19 24.4043L26.0711 17.3332L26.0608 19.5192L21.1757 24.4043L26.0711 29.2761L26.0711 31.4754L19 24.4043Z" fill="white"/>
10
- <defs>
11
- <linearGradient id="paint0_linear_7489_5863" x1="4.63636" y1="9.4043" x2="48.3522" y2="18.0623" gradientUnits="userSpaceOnUse">
12
- <stop stop-color="white" stop-opacity="0.2"/>
13
- <stop offset="0.468859" stop-color="white" stop-opacity="0.15"/>
14
- <stop offset="1" stop-color="white" stop-opacity="0.4"/>
15
- </linearGradient>
16
- </defs>
17
- </svg>
1
+ <svg
2
+ width='48'
3
+ height='49'
4
+ viewBox='0 0 48 49'
5
+ fill='none'
6
+ xmlns='http://www.w3.org/2000/svg'
7
+ >
8
+ <rect x="0.5" y="0.904297" width="47" height="47" rx="23.5" fill="white" fill-opacity="0.06" stroke="url(#paint0_linear_7489_5863)"/>
9
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M19 24.4043L26.0711 17.3332L26.0608 19.5192L21.1757 24.4043L26.0711 29.2761L26.0711 31.4754L19 24.4043Z" fill="white"/>
10
+ <defs>
11
+ <linearGradient id="paint0_linear_7489_5863" x1="4.63636" y1="9.4043" x2="48.3522" y2="18.0623" gradientUnits="userSpaceOnUse">
12
+ <stop stop-color="white" stop-opacity="0.2"/>
13
+ <stop offset="0.468859" stop-color="white" stop-opacity="0.15"/>
14
+ <stop offset="1" stop-color="white" stop-opacity="0.4"/>
15
+ </linearGradient>
16
+ </defs>
17
+ </svg>
@@ -1,74 +1,74 @@
1
- {% comment %}
2
- 按钮配置选项:
3
- type:按钮类型
4
- - primary:主要按钮
5
- - default:默认按钮
6
- - round:圆角按钮
7
- - link:链接按钮
8
-
9
- color:按钮颜色
10
- - black:黑色
11
- - white:白色
12
- - orange:橙色
13
-
14
- size:按钮尺寸
15
- - large:大号
16
- - medium:中号(默认)
17
- - small:小号
18
-
19
- 其他参数:
20
- - href:链接地址
21
- - backdrop_filter:毛玻璃效果 true/false
22
- - icon:图标名称
23
- - text:按钮文字
24
- - class_name:自定义类名
25
- {% endcomment %}
26
-
27
- {% assign icon_name = icon_name | default: 'download' %}
28
- {% assign icon_color = icon_color | default: 'currentColor' %}
29
- {% assign icon_size = icon_size | default: '15' %}
30
-
31
- {% if icon_name == 'download' %}
32
- <svg
33
- width='{{ icon_size }}px'
34
- height='{{ icon_size }}px'
35
- viewBox='0 0 15 15'
36
- fill='none'
37
- xmlns='http://www.w3.org/2000/svg'
38
- >
39
- <path d="M7.50005 1.04999C7.74858 1.04999 7.95005 1.25146 7.95005 1.49999V8.41359L10.1819 6.18179C10.3576 6.00605 10.6425 6.00605 10.8182 6.18179C10.994 6.35753 10.994 6.64245 10.8182 6.81819L7.81825 9.81819C7.64251 9.99392 7.35759 9.99392 7.18185 9.81819L4.18185 6.81819C4.00611 6.64245 4.00611 6.35753 4.18185 6.18179C4.35759 6.00605 4.64251 6.00605 4.81825 6.18179L7.05005 8.41359V1.49999C7.05005 1.25146 7.25152 1.04999 7.50005 1.04999ZM2.5 10C2.77614 10 3 10.2239 3 10.5V12C3 12.5539 3.44565 13 3.99635 13H11.0012C11.5529 13 12 12.5528 12 12V10.5C12 10.2239 12.2239 10 12.5 10C12.7761 10 13 10.2239 13 10.5V12C13 13.1041 12.1062 14 11.0012 14H3.99635C2.89019 14 2 13.103 2 12V10.5C2 10.2239 2.22386 10 2.5 10Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path>
40
- </svg>
41
- {% elsif icon_name == 'arrow-right' %}
42
- <svg
43
- width='{{ icon_size }}px'
44
- height='{{ icon_size }}px'
45
- viewBox='0 0 15 15'
46
- fill='none'
47
- xmlns='http://www.w3.org/2000/svg'
48
- >
49
- <path d="M6.1584 3.13508C6.35985 2.94621 6.67627 2.95642 6.86514 3.15788L10.6151 7.15788C10.7954 7.3502 10.7954 7.64949 10.6151 7.84182L6.86514 11.8418C6.67627 12.0433 6.35985 12.0535 6.1584 11.8646C5.95694 11.6757 5.94673 11.3593 6.1356 11.1579L9.565 7.49985L6.1356 3.84182C5.94673 3.64036 5.95694 3.32394 6.1584 3.13508Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path>
50
- </svg>
51
- {% elsif icon_name == 'mail' %}
52
- <svg
53
- width='{{ icon_size }}px'
54
- height='{{ icon_size }}px'
55
- viewBox='0 0 15 15'
56
- fill='none'
57
- xmlns='http://www.w3.org/2000/svg'
58
- >
59
- <path d="M1 2C0.447715 2 0 2.44772 0 3V12C0 12.5523 0.447715 13 1 13H14C14.5523 13 15 12.5523 15 12V3C15 2.44772 14.5523 2 14 2H1ZM1 3L14 3V3.92494C13.9174 3.92486 13.8338 3.94751 13.7589 3.99505L7.5 7.96703L1.24112 3.99505C1.16621 3.94751 1.0826 3.92486 1 3.92494V3ZM1 4.90797V12H14V4.90797L7.74112 8.87995C7.59394 8.97335 7.40606 8.97335 7.25888 8.87995L1 4.90797Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path>
60
- </svg>
61
- {% elsif icon_name == "copy" %}
62
- <svg
63
- width='{{ icon_size }}px'
64
- height='{{ icon_size }}px'
65
- viewBox='0 0 25 25'
66
- fill='none'
67
- xmlns='http://www.w3.org/2000/svg'
68
- >
69
- <path d="M10 8.76172V7.26172C10 6.98558 10.2239 6.76172 10.5 6.76172H17.5C17.7761 6.76172 18 6.98558 18 7.26172V16.7617C18 17.0379 17.7761 17.2617 17.5 17.2617H15.7778" stroke="currentColor" stroke-linecap="round"/>
70
- <rect x="8" y="8.76172" width="8" height="10" rx="0.5" stroke="currentColor"/>
71
- <path d="M10 11.7617H13" stroke="currentColor" stroke-linecap="round"/>
72
- <path d="M10 14.7617H12" stroke="currentColor" stroke-linecap="round"/>
73
- </svg>
74
- {% endif %}
1
+ {% comment %}
2
+ 按钮配置选项:
3
+ type:按钮类型
4
+ - primary:主要按钮
5
+ - default:默认按钮
6
+ - round:圆角按钮
7
+ - link:链接按钮
8
+
9
+ color:按钮颜色
10
+ - black:黑色
11
+ - white:白色
12
+ - orange:橙色
13
+
14
+ size:按钮尺寸
15
+ - large:大号
16
+ - medium:中号(默认)
17
+ - small:小号
18
+
19
+ 其他参数:
20
+ - href:链接地址
21
+ - backdrop_filter:毛玻璃效果 true/false
22
+ - icon:图标名称
23
+ - text:按钮文字
24
+ - class_name:自定义类名
25
+ {% endcomment %}
26
+
27
+ {% assign icon_name = icon_name | default: 'download' %}
28
+ {% assign icon_color = icon_color | default: 'currentColor' %}
29
+ {% assign icon_size = icon_size | default: '15' %}
30
+
31
+ {% if icon_name == 'download' %}
32
+ <svg
33
+ width='{{ icon_size }}px'
34
+ height='{{ icon_size }}px'
35
+ viewBox='0 0 15 15'
36
+ fill='none'
37
+ xmlns='http://www.w3.org/2000/svg'
38
+ >
39
+ <path d="M7.50005 1.04999C7.74858 1.04999 7.95005 1.25146 7.95005 1.49999V8.41359L10.1819 6.18179C10.3576 6.00605 10.6425 6.00605 10.8182 6.18179C10.994 6.35753 10.994 6.64245 10.8182 6.81819L7.81825 9.81819C7.64251 9.99392 7.35759 9.99392 7.18185 9.81819L4.18185 6.81819C4.00611 6.64245 4.00611 6.35753 4.18185 6.18179C4.35759 6.00605 4.64251 6.00605 4.81825 6.18179L7.05005 8.41359V1.49999C7.05005 1.25146 7.25152 1.04999 7.50005 1.04999ZM2.5 10C2.77614 10 3 10.2239 3 10.5V12C3 12.5539 3.44565 13 3.99635 13H11.0012C11.5529 13 12 12.5528 12 12V10.5C12 10.2239 12.2239 10 12.5 10C12.7761 10 13 10.2239 13 10.5V12C13 13.1041 12.1062 14 11.0012 14H3.99635C2.89019 14 2 13.103 2 12V10.5C2 10.2239 2.22386 10 2.5 10Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path>
40
+ </svg>
41
+ {% elsif icon_name == 'arrow-right' %}
42
+ <svg
43
+ width='{{ icon_size }}px'
44
+ height='{{ icon_size }}px'
45
+ viewBox='0 0 15 15'
46
+ fill='none'
47
+ xmlns='http://www.w3.org/2000/svg'
48
+ >
49
+ <path d="M6.1584 3.13508C6.35985 2.94621 6.67627 2.95642 6.86514 3.15788L10.6151 7.15788C10.7954 7.3502 10.7954 7.64949 10.6151 7.84182L6.86514 11.8418C6.67627 12.0433 6.35985 12.0535 6.1584 11.8646C5.95694 11.6757 5.94673 11.3593 6.1356 11.1579L9.565 7.49985L6.1356 3.84182C5.94673 3.64036 5.95694 3.32394 6.1584 3.13508Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path>
50
+ </svg>
51
+ {% elsif icon_name == 'mail' %}
52
+ <svg
53
+ width='{{ icon_size }}px'
54
+ height='{{ icon_size }}px'
55
+ viewBox='0 0 15 15'
56
+ fill='none'
57
+ xmlns='http://www.w3.org/2000/svg'
58
+ >
59
+ <path d="M1 2C0.447715 2 0 2.44772 0 3V12C0 12.5523 0.447715 13 1 13H14C14.5523 13 15 12.5523 15 12V3C15 2.44772 14.5523 2 14 2H1ZM1 3L14 3V3.92494C13.9174 3.92486 13.8338 3.94751 13.7589 3.99505L7.5 7.96703L1.24112 3.99505C1.16621 3.94751 1.0826 3.92486 1 3.92494V3ZM1 4.90797V12H14V4.90797L7.74112 8.87995C7.59394 8.97335 7.40606 8.97335 7.25888 8.87995L1 4.90797Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path>
60
+ </svg>
61
+ {% elsif icon_name == "copy" %}
62
+ <svg
63
+ width='{{ icon_size }}px'
64
+ height='{{ icon_size }}px'
65
+ viewBox='0 0 25 25'
66
+ fill='none'
67
+ xmlns='http://www.w3.org/2000/svg'
68
+ >
69
+ <path d="M10 8.76172V7.26172C10 6.98558 10.2239 6.76172 10.5 6.76172H17.5C17.7761 6.76172 18 6.98558 18 7.26172V16.7617C18 17.0379 17.7761 17.2617 17.5 17.2617H15.7778" stroke="currentColor" stroke-linecap="round"/>
70
+ <rect x="8" y="8.76172" width="8" height="10" rx="0.5" stroke="currentColor"/>
71
+ <path d="M10 11.7617H13" stroke="currentColor" stroke-linecap="round"/>
72
+ <path d="M10 14.7617H12" stroke="currentColor" stroke-linecap="round"/>
73
+ </svg>
74
+ {% endif %}
@@ -1,44 +1,44 @@
1
- {% comment %}
2
- pc_image: pc 端图片
3
- mb_image: 移动端图片
4
- image_alt: 图片描述
5
- class_name: 增加类名
6
- close_lazy: 是否关闭懒加载 true 关闭 false 开启
7
- pc_width: pc 端宽度, 做图片尺寸优化
8
- mb_width: 移动端宽度, 做图片尺寸优化
9
- {% endcomment %}
10
- {%- assign pc_width = pc_width | default: 1800 -%}
11
- {%- assign mb_width = mb_width | default: 800 -%}
12
-
13
- {%- assign pc_classes = class_name | append: ' max-md:tw-hidden tw-w-full tw-h-auto tw-object-cover' -%}
14
- {%- assign mb_classes = class_name | append: ' md:tw-hidden tw-w-full tw-h-auto tw-object-cover' -%}
15
-
16
- {%- if close_lazy == true -%}
17
- {%- assign lazy_load = 'eager' -%}
18
- {%- else -%}
19
- {%- assign lazy_load = 'lazy' -%}
20
- {%- endif -%}
21
-
22
- {%- if pc_image -%}
23
- {{
24
- pc_image
25
- | image_url: width: pc_width
26
- | image_tag:
27
- alt: image_alt,
28
- class: pc_classes,
29
- widths: '800, 1000, 1200, 1500, 1800 2000',
30
- loading: lazy_load
31
- }}
32
- {%- endif -%}
33
- {%- if mb_image -%}
34
- {{
35
- mb_image
36
- | image_url: width: mb_width
37
- | image_tag:
38
- alt: image_alt,
39
- class: mb_classes,
40
- widths: '400, 600, 800',
41
- loading: lazy_load
42
- }}
43
- {%- endif -%}
44
-
1
+ {% comment %}
2
+ pc_image: pc 端图片
3
+ mb_image: 移动端图片
4
+ image_alt: 图片描述
5
+ class_name: 增加类名
6
+ close_lazy: 是否关闭懒加载 true 关闭 false 开启
7
+ pc_width: pc 端宽度, 做图片尺寸优化
8
+ mb_width: 移动端宽度, 做图片尺寸优化
9
+ {% endcomment %}
10
+ {%- assign pc_width = pc_width | default: 1800 -%}
11
+ {%- assign mb_width = mb_width | default: 800 -%}
12
+
13
+ {%- assign pc_classes = class_name | append: ' max-md:tw-hidden tw-w-full tw-h-auto tw-object-cover' -%}
14
+ {%- assign mb_classes = class_name | append: ' md:tw-hidden tw-w-full tw-h-auto tw-object-cover' -%}
15
+
16
+ {%- if close_lazy == true -%}
17
+ {%- assign lazy_load = 'eager' -%}
18
+ {%- else -%}
19
+ {%- assign lazy_load = 'lazy' -%}
20
+ {%- endif -%}
21
+
22
+ {%- if pc_image -%}
23
+ {{
24
+ pc_image
25
+ | image_url: width: pc_width
26
+ | image_tag:
27
+ alt: image_alt,
28
+ class: pc_classes,
29
+ widths: '800, 1000, 1200, 1500, 1800 2000',
30
+ loading: lazy_load
31
+ }}
32
+ {%- endif -%}
33
+ {%- if mb_image -%}
34
+ {{
35
+ mb_image
36
+ | image_url: width: mb_width
37
+ | image_tag:
38
+ alt: image_alt,
39
+ class: mb_classes,
40
+ widths: '400, 600, 800',
41
+ loading: lazy_load
42
+ }}
43
+ {%- endif -%}
44
+
@@ -1,44 +1,44 @@
1
- {% comment %}
2
- pc_image: pc 端图片
3
- mb_image: 移动端图片
4
- image_alt: 图片描述
5
- class_name: 增加类名
6
- close_lazy: 是否关闭懒加载 true 关闭 false 开启
7
- pc_width: pc 端宽度, 做图片尺寸优化
8
- mb_width: 移动端宽度, 做图片尺寸优化
9
- {% endcomment %}
10
- {%- assign pc_width = pc_width | default: 1800 -%}
11
- {%- assign mb_width = mb_width | default: 800 -%}
12
-
13
- {%- assign pc_classes = class_name | append: ' max-lg:tw-hidden tw-w-full tw-h-auto tw-object-cover' -%}
14
- {%- assign mb_classes = class_name | append: ' lg:tw-hidden tw-w-full tw-h-auto tw-object-cover' -%}
15
-
16
- {%- if close_lazy == true -%}
17
- {%- assign lazy_load = 'eager' -%}
18
- {%- else -%}
19
- {%- assign lazy_load = 'lazy' -%}
20
- {%- endif -%}
21
-
22
- {%- if pc_image -%}
23
- {{
24
- pc_image
25
- | image_url: width: pc_width
26
- | image_tag:
27
- alt: image_alt,
28
- class: pc_classes,
29
- widths: '800, 1000, 1200, 1500, 1800 2000',
30
- loading: lazy_load
31
- }}
32
- {%- endif -%}
33
- {%- if mb_image -%}
34
- {{
35
- mb_image
36
- | image_url: width: mb_width
37
- | image_tag:
38
- alt: image_alt,
39
- class: mb_classes,
40
- widths: '400, 600, 800',
41
- loading: lazy_load
42
- }}
43
- {%- endif -%}
44
-
1
+ {% comment %}
2
+ pc_image: pc 端图片
3
+ mb_image: 移动端图片
4
+ image_alt: 图片描述
5
+ class_name: 增加类名
6
+ close_lazy: 是否关闭懒加载 true 关闭 false 开启
7
+ pc_width: pc 端宽度, 做图片尺寸优化
8
+ mb_width: 移动端宽度, 做图片尺寸优化
9
+ {% endcomment %}
10
+ {%- assign pc_width = pc_width | default: 1800 -%}
11
+ {%- assign mb_width = mb_width | default: 800 -%}
12
+
13
+ {%- assign pc_classes = class_name | append: ' max-lg:tw-hidden tw-w-full tw-h-auto tw-object-cover' -%}
14
+ {%- assign mb_classes = class_name | append: ' lg:tw-hidden tw-w-full tw-h-auto tw-object-cover' -%}
15
+
16
+ {%- if close_lazy == true -%}
17
+ {%- assign lazy_load = 'eager' -%}
18
+ {%- else -%}
19
+ {%- assign lazy_load = 'lazy' -%}
20
+ {%- endif -%}
21
+
22
+ {%- if pc_image -%}
23
+ {{
24
+ pc_image
25
+ | image_url: width: pc_width
26
+ | image_tag:
27
+ alt: image_alt,
28
+ class: pc_classes,
29
+ widths: '800, 1000, 1200, 1500, 1800 2000',
30
+ loading: lazy_load
31
+ }}
32
+ {%- endif -%}
33
+ {%- if mb_image -%}
34
+ {{
35
+ mb_image
36
+ | image_url: width: mb_width
37
+ | image_tag:
38
+ alt: image_alt,
39
+ class: mb_classes,
40
+ widths: '400, 600, 800',
41
+ loading: lazy_load
42
+ }}
43
+ {%- endif -%}
44
+
@@ -1,36 +1,36 @@
1
- {% comment %}
2
- type: 类型 prev | next
3
- color_type: 颜色类型 dark | light
4
- class_name: 增加类名
5
- {% endcomment %}
6
- {% if type == 'prev' %}
7
- <div class="tw-cursor-pointer {% if color_type == 'light' %} tw-bg-white/20 {% else %} tw-bg-black/20 {% endif %} tw-backdrop-blur-[10px] tw-rounded-[50%] max-lg:tw-w-[36px] max-lg:tw-h-[36px] lg:tw-w-[48px] lg:tw-h-[48px] tw-flex tw-justify-center tw-items-center">
8
- <div class="lg:tw-w-[24px] lg:tw-h-[24px] tw-w-[18px] tw-h-[18px]">
9
- {% if color_type == 'light' %}
10
- <svg width="100%" height="100%" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
11
- <path fill-rule="evenodd" clip-rule="evenodd" d="M7 12L14.0711 4.92893L14.0608 7.11487L9.17571 12L14.0711 16.8718L14.0711 19.0711L7 12Z" fill="white"/>
12
- </svg>
13
- {% else %}
14
- <svg width="100%" height="100%" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
15
- <path fill-rule="evenodd" clip-rule="evenodd" d="M7 12L14.0711 4.92893L14.0608 7.11487L9.17571 12L14.0711 16.8718L14.0711 19.0711L7 12Z" fill="black"/>
16
- </svg>
17
- {% endif %}
18
- </div>
19
- </div>
20
-
21
- {% else %}
22
- <div class="tw-cursor-pointer {% if color_type == 'light' %} tw-bg-white/20 {% else %} tw-bg-black/20 {% endif %} tw-backdrop-blur-[10px] tw-rounded-[50%] max-lg:tw-w-[36px] max-lg:tw-h-[36px] lg:tw-w-[48px] lg:tw-h-[48px] tw-flex tw-justify-center tw-items-center">
23
- <div class="lg:tw-w-[24px] lg:tw-h-[24px] tw-w-[18px] tw-h-[18px]">
24
- {% if color_type == 'light' %}
25
- <svg width="100%" height="100%" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
26
- <path fill-rule="evenodd" clip-rule="evenodd" d="M17 12L9.92893 4.92893L9.93916 7.11487L14.8243 12L9.92893 16.8718L9.92893 19.0711L17 12Z" fill="white"/>
27
- </svg>
28
-
29
- {% else %}
30
- <svg width="100%" height="100%" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
31
- <path fill-rule="evenodd" clip-rule="evenodd" d="M17 12L9.92893 4.92893L9.93916 7.11487L14.8243 12L9.92893 16.8718L9.92893 19.0711L17 12Z" fill="black"/>
32
- </svg>
33
- {% endif %}
34
- </div>
35
- </div>
36
- {% endif %}
1
+ {% comment %}
2
+ type: 类型 prev | next
3
+ color_type: 颜色类型 dark | light
4
+ class_name: 增加类名
5
+ {% endcomment %}
6
+ {% if type == 'prev' %}
7
+ <div class="tw-cursor-pointer {% if color_type == 'light' %} tw-bg-white/20 {% else %} tw-bg-black/20 {% endif %} tw-backdrop-blur-[10px] tw-rounded-[50%] max-lg:tw-w-[36px] max-lg:tw-h-[36px] lg:tw-w-[48px] lg:tw-h-[48px] tw-flex tw-justify-center tw-items-center">
8
+ <div class="lg:tw-w-[24px] lg:tw-h-[24px] tw-w-[18px] tw-h-[18px]">
9
+ {% if color_type == 'light' %}
10
+ <svg width="100%" height="100%" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
11
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M7 12L14.0711 4.92893L14.0608 7.11487L9.17571 12L14.0711 16.8718L14.0711 19.0711L7 12Z" fill="white"/>
12
+ </svg>
13
+ {% else %}
14
+ <svg width="100%" height="100%" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
15
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M7 12L14.0711 4.92893L14.0608 7.11487L9.17571 12L14.0711 16.8718L14.0711 19.0711L7 12Z" fill="black"/>
16
+ </svg>
17
+ {% endif %}
18
+ </div>
19
+ </div>
20
+
21
+ {% else %}
22
+ <div class="tw-cursor-pointer {% if color_type == 'light' %} tw-bg-white/20 {% else %} tw-bg-black/20 {% endif %} tw-backdrop-blur-[10px] tw-rounded-[50%] max-lg:tw-w-[36px] max-lg:tw-h-[36px] lg:tw-w-[48px] lg:tw-h-[48px] tw-flex tw-justify-center tw-items-center">
23
+ <div class="lg:tw-w-[24px] lg:tw-h-[24px] tw-w-[18px] tw-h-[18px]">
24
+ {% if color_type == 'light' %}
25
+ <svg width="100%" height="100%" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
26
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M17 12L9.92893 4.92893L9.93916 7.11487L14.8243 12L9.92893 16.8718L9.92893 19.0711L17 12Z" fill="white"/>
27
+ </svg>
28
+
29
+ {% else %}
30
+ <svg width="100%" height="100%" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
31
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M17 12L9.92893 4.92893L9.93916 7.11487L14.8243 12L9.92893 16.8718L9.92893 19.0711L17 12Z" fill="black"/>
32
+ </svg>
33
+ {% endif %}
34
+ </div>
35
+ </div>
36
+ {% endif %}
@@ -1,62 +1,62 @@
1
- {% comment %}
2
- type: 类型 prev | next
3
- color_type: 颜色类型 dark | light
4
- class_name: 增加类名
5
- {% endcomment %}
6
- {% if type == 'prev' %}
7
- {% if color_type == 'light' %}
8
- <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
9
- <foreignObject x="-12" y="-12" width="72" height="72"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(6px);clip-path:url(#bgblur_0_15512_12512_clip_path);height:100%;width:100%"></div></foreignObject><rect data-figma-bg-blur-radius="12" width="48" height="48" rx="24" fill="white" fill-opacity="0.3"/>
10
- <path fill-rule="evenodd" clip-rule="evenodd" d="M19 24L26.0711 16.9289L26.0608 19.1149L21.1757 24L26.0711 28.8718L26.0711 31.0711L19 24Z" fill="white"/>
11
- <defs>
12
- <clipPath id="bgblur_0_15512_12512_clip_path" transform="translate(12 12)"><rect width="48" height="48" rx="24"/>
13
- </clipPath></defs>
14
- </svg>
15
- {% else %}
16
- <svg
17
- width='36'
18
- height='36'
19
- viewBox='0 0 36 36'
20
- fill='none'
21
- xmlns='http://www.w3.org/2000/svg'
22
- >
23
- <foreignObject x="-12" y="-12" width="60" height="60"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(6px);clip-path:url(#bgblur_0_12868_2987_clip_path);height:100%;width:100%"></div></foreignObject><g data-figma-bg-blur-radius="12">
24
- <rect width="36" height="36" rx="18" fill="black" fill-opacity="0.03"/>
25
- <rect x="0.5" y="0.5" width="35" height="35" rx="17.5" stroke="black" stroke-opacity="0.06"/>
26
- </g>
27
- <path fill-rule="evenodd" clip-rule="evenodd" d="M13 18L20.0711 10.9289L20.0608 13.1149L15.1757 18L20.0711 22.8718L20.0711 25.0711L13 18Z" fill="black"/>
28
- <defs>
29
- <clipPath id="bgblur_0_12868_2987_clip_path" transform="translate(12 12)"><rect width="36" height="36" rx="18"/>
30
- </clipPath></defs>
31
- </svg>
32
-
33
- {% endif %}
34
- {% else %}
35
- {% if color_type == 'light' %}
36
- <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
37
- <foreignObject x="-12" y="-12" width="72" height="72"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(6px);clip-path:url(#bgblur_0_15512_12506_clip_path);height:100%;width:100%"></div></foreignObject><rect data-figma-bg-blur-radius="12" width="48" height="48" rx="24" fill="white" fill-opacity="0.3"/>
38
- <path fill-rule="evenodd" clip-rule="evenodd" d="M29 24L21.9289 16.9289L21.9392 19.1149L26.8243 24L21.9289 28.8718L21.9289 31.0711L29 24Z" fill="white"/>
39
- <defs>
40
- <clipPath id="bgblur_0_15512_12506_clip_path" transform="translate(12 12)"><rect width="48" height="48" rx="24"/>
41
- </clipPath></defs>
42
- </svg>
43
-
44
- {% else %}
45
- <svg
46
- width='36'
47
- height='36'
48
- viewBox='0 0 36 36'
49
- fill='none'
50
- xmlns='http://www.w3.org/2000/svg'
51
- >
52
- <foreignObject x="-11.9957" y="-12" width="60" height="60"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(6px);clip-path:url(#bgblur_0_12868_2998_clip_path);height:100%;width:100%"></div></foreignObject><g data-figma-bg-blur-radius="12">
53
- <rect x="0.0043335" width="36" height="36" rx="18" fill="black" fill-opacity="0.03"/>
54
- <rect x="0.504333" y="0.5" width="35" height="35" rx="17.5" stroke="black" stroke-opacity="0.06"/>
55
- </g>
56
- <path fill-rule="evenodd" clip-rule="evenodd" d="M23.0043 18L15.9333 10.9289L15.9435 13.1149L20.8286 18L15.9333 22.8718L15.9333 25.0711L23.0043 18Z" fill="black"/>
57
- <defs>
58
- <clipPath id="bgblur_0_12868_2998_clip_path" transform="translate(11.9957 12)"><rect x="0.0043335" width="36" height="36" rx="18"/>
59
- </clipPath></defs>
60
- </svg>
61
- {% endif %}
62
- {% endif %}
1
+ {% comment %}
2
+ type: 类型 prev | next
3
+ color_type: 颜色类型 dark | light
4
+ class_name: 增加类名
5
+ {% endcomment %}
6
+ {% if type == 'prev' %}
7
+ {% if color_type == 'light' %}
8
+ <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
9
+ <foreignObject x="-12" y="-12" width="72" height="72"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(6px);clip-path:url(#bgblur_0_15512_12512_clip_path);height:100%;width:100%"></div></foreignObject><rect data-figma-bg-blur-radius="12" width="48" height="48" rx="24" fill="white" fill-opacity="0.3"/>
10
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M19 24L26.0711 16.9289L26.0608 19.1149L21.1757 24L26.0711 28.8718L26.0711 31.0711L19 24Z" fill="white"/>
11
+ <defs>
12
+ <clipPath id="bgblur_0_15512_12512_clip_path" transform="translate(12 12)"><rect width="48" height="48" rx="24"/>
13
+ </clipPath></defs>
14
+ </svg>
15
+ {% else %}
16
+ <svg
17
+ width='36'
18
+ height='36'
19
+ viewBox='0 0 36 36'
20
+ fill='none'
21
+ xmlns='http://www.w3.org/2000/svg'
22
+ >
23
+ <foreignObject x="-12" y="-12" width="60" height="60"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(6px);clip-path:url(#bgblur_0_12868_2987_clip_path);height:100%;width:100%"></div></foreignObject><g data-figma-bg-blur-radius="12">
24
+ <rect width="36" height="36" rx="18" fill="black" fill-opacity="0.03"/>
25
+ <rect x="0.5" y="0.5" width="35" height="35" rx="17.5" stroke="black" stroke-opacity="0.06"/>
26
+ </g>
27
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M13 18L20.0711 10.9289L20.0608 13.1149L15.1757 18L20.0711 22.8718L20.0711 25.0711L13 18Z" fill="black"/>
28
+ <defs>
29
+ <clipPath id="bgblur_0_12868_2987_clip_path" transform="translate(12 12)"><rect width="36" height="36" rx="18"/>
30
+ </clipPath></defs>
31
+ </svg>
32
+
33
+ {% endif %}
34
+ {% else %}
35
+ {% if color_type == 'light' %}
36
+ <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
37
+ <foreignObject x="-12" y="-12" width="72" height="72"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(6px);clip-path:url(#bgblur_0_15512_12506_clip_path);height:100%;width:100%"></div></foreignObject><rect data-figma-bg-blur-radius="12" width="48" height="48" rx="24" fill="white" fill-opacity="0.3"/>
38
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M29 24L21.9289 16.9289L21.9392 19.1149L26.8243 24L21.9289 28.8718L21.9289 31.0711L29 24Z" fill="white"/>
39
+ <defs>
40
+ <clipPath id="bgblur_0_15512_12506_clip_path" transform="translate(12 12)"><rect width="48" height="48" rx="24"/>
41
+ </clipPath></defs>
42
+ </svg>
43
+
44
+ {% else %}
45
+ <svg
46
+ width='36'
47
+ height='36'
48
+ viewBox='0 0 36 36'
49
+ fill='none'
50
+ xmlns='http://www.w3.org/2000/svg'
51
+ >
52
+ <foreignObject x="-11.9957" y="-12" width="60" height="60"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(6px);clip-path:url(#bgblur_0_12868_2998_clip_path);height:100%;width:100%"></div></foreignObject><g data-figma-bg-blur-radius="12">
53
+ <rect x="0.0043335" width="36" height="36" rx="18" fill="black" fill-opacity="0.03"/>
54
+ <rect x="0.504333" y="0.5" width="35" height="35" rx="17.5" stroke="black" stroke-opacity="0.06"/>
55
+ </g>
56
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M23.0043 18L15.9333 10.9289L15.9435 13.1149L20.8286 18L15.9333 22.8718L15.9333 25.0711L23.0043 18Z" fill="black"/>
57
+ <defs>
58
+ <clipPath id="bgblur_0_12868_2998_clip_path" transform="translate(11.9957 12)"><rect x="0.0043335" width="36" height="36" rx="18"/>
59
+ </clipPath></defs>
60
+ </svg>
61
+ {% endif %}
62
+ {% endif %}