Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge remote-tracking branch 'upstream/main' into card-section
- Loading branch information
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,31 @@ | ||
| <div style="background-color: {{ section.settings.background_color }};"> | ||
| {{ section.settings.custom_liquid }} | ||
| </div> | ||
|
|
||
| {% schema %} | ||
| { | ||
| "name": "Custom Liquid", | ||
| "tag": "section", | ||
| "class": "section", | ||
| "settings": [ | ||
| { | ||
| "type": "liquid", | ||
| "id": "custom_liquid", | ||
| "label": "Custom Liquid", | ||
| "info": "Add app snippets or other code to create advanced customizations. [Learn more](https://shopify.dev/docs/api/liquid)" | ||
| }, | ||
| { | ||
| "type": "color", | ||
| "id": "background_color", | ||
| "label": "Background Color", | ||
| "info": "Choose a background color for the section." | ||
| } | ||
| ], | ||
| "presets": [ | ||
| { | ||
| "name": "Custom Liquid" | ||
| } | ||
| ] | ||
| } | ||
|
|
||
| {% endschema %} | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,223 @@ | ||
| {% assign section_id = section.id %} | ||
| {% assign section_classes = 'section-' | append: section_id | append: '-padding' %} | ||
|
|
||
| <div class="color-{{ section.settings.color_scheme }} gradient isolate"> | ||
| <div class="page-width {{ section_classes }}"> | ||
| {% if section.settings.heading != blank %} | ||
| <h2 class="collage-wrapper-title inline-richtext {{ section.settings.heading_size }}"> | ||
| {{ section.settings.heading }} | ||
| </h2> | ||
| {% endif %} | ||
| <div class="collage{% if section.settings.mobile_layout == 'collage' %} collage--mobile{% endif %}"> | ||
| {% for block in section.blocks %} | ||
| <div class="collage__item collage__item--{{ block.type }} collage__item--{{ section.settings.desktop_layout }}"> | ||
| {% case block.type %} | ||
| {% when 'image' %} | ||
| <div class="collage-card"> | ||
| <div class="media media--transparent ratio"> | ||
| {{ block.settings.image | img_url: 'master' | img_tag: 'collage-image' }} | ||
|
Check warning on line 18 in sections/dev_collage.liquid
|
||
| </div> | ||
| </div> | ||
| {% when 'product' %} | ||
| <div class="collage-card product-card"> | ||
| {% if block.settings.second_image %} | ||
| {{ block.settings.second_image | img_url: 'master' | img_tag: 'second-image' }} | ||
|
Check warning on line 24 in sections/dev_collage.liquid
|
||
| {% else %} | ||
| <div class="product"> | ||
| <h3 class="product__title">{{ block.settings.product.title }}</h3> | ||
| <p class="product__description">{{ block.settings.product.description }}</p> | ||
| <p class="product__price">Price: {{ block.settings.product.price | money }}</p> | ||
| <p class="product__sku">SKU: {{ block.settings.product.sku }}</p> | ||
| <!-- Add more product details as needed --> | ||
| <a href="{{ block.settings.product.url }}" class="btn btn-primary">Shop Now</a> | ||
| </div> | ||
| {% endif %} | ||
| </div> | ||
| {% when 'collection' %} | ||
| <div class="collage-card collection-card"> | ||
| <div class="collection"> | ||
| <h3 class="collection__title">{{ block.settings.collection.title }}</h3> | ||
| <p class="collection__description">{{ block.settings.collection.description }}</p> | ||
| <!-- Display collection items or details as needed --> | ||
| <a href="{{ block.settings.collection.url }}" class="btn btn-secondary">{{ block.settings.collection_text | default: block.settings.collection.title }}</a> | ||
| </div> | ||
| </div> | ||
| {% when 'video' %} | ||
| <div class="collage-card video-card"> | ||
| <div class="media media--transparent ratio"> | ||
| {{ block.settings.cover_image | img_url: 'master' | img_tag: 'video-cover' }} | ||
|
Check warning on line 48 in sections/dev_collage.liquid
|
||
| </div> | ||
| <a href="{{ block.settings.video_url }}" class="collage-card__link"></a> | ||
| </div> | ||
| {% endcase %} | ||
| </div> | ||
| {% endfor %} | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| {% schema %} | ||
| { | ||
| "name": "Custom Collage", | ||
| "tag": "section", | ||
| "class": "section", | ||
| "settings": [ | ||
| { | ||
| "type": "inline_richtext", | ||
| "id": "heading", | ||
| "default": "Multimedia Collage", | ||
| "label": "Heading" | ||
| }, | ||
| { | ||
| "type": "select", | ||
| "id": "heading_size", | ||
| "options": [ | ||
| { "value": "h2", "label": "H2" }, | ||
| { "value": "h1", "label": "H1" }, | ||
| { "value": "h0", "label": "H0" } | ||
| ], | ||
| "default": "h1", | ||
| "label": "Heading Size" | ||
| }, | ||
| { | ||
| "type": "select", | ||
| "id": "desktop_layout", | ||
| "options": [ | ||
| { "value": "left", "label": "Left" }, | ||
| { "value": "right", "label": "Right" } | ||
| ], | ||
| "default": "left", | ||
| "label": "Desktop Layout" | ||
| }, | ||
| { | ||
| "type": "select", | ||
| "id": "mobile_layout", | ||
| "options": [ | ||
| { "value": "collage", "label": "Collage" }, | ||
| { "value": "column", "label": "Column" } | ||
| ], | ||
| "default": "column", | ||
| "label": "Mobile Layout" | ||
| }, | ||
| { | ||
| "type": "select", | ||
| "id": "card_styles", | ||
| "options": [ | ||
| { "value": "none", "label": "None" }, | ||
| { "value": "product-card-wrapper", "label": "Product Card Wrapper" } | ||
| ], | ||
| "default": "product-card-wrapper", | ||
| "label": "Card Styles" | ||
| }, | ||
| { | ||
| "type": "color_scheme", | ||
| "id": "color_scheme", | ||
| "label": "Color Scheme", | ||
| "default": "scheme-1" | ||
| }, | ||
| { | ||
| "type": "range", | ||
| "id": "padding_top", | ||
| "min": 0, | ||
| "max": 100, | ||
| "step": 4, | ||
| "unit": "px", | ||
| "label": "Padding Top", | ||
| "default": 36 | ||
| }, | ||
| { | ||
| "type": "range", | ||
| "id": "padding_bottom", | ||
| "min": 0, | ||
| "max": 100, | ||
| "step": 4, | ||
| "unit": "px", | ||
| "label": "Padding Bottom", | ||
| "default": 36 | ||
| } | ||
| ], | ||
| "blocks": [ | ||
| { | ||
| "type": "image", | ||
| "name": "Image", | ||
| "settings": [ | ||
| { | ||
| "type": "image_picker", | ||
| "id": "image", | ||
| "label": "Image" | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "product", | ||
| "name": "Product", | ||
| "settings": [ | ||
| { | ||
| "type": "product", | ||
| "id": "product", | ||
| "label": "Product" | ||
| }, | ||
| { | ||
| "type": "checkbox", | ||
| "id": "second_image", | ||
| "default": false, | ||
| "label": "Second Image" | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "collection", | ||
| "name": "Collection", | ||
| "settings": [ | ||
| { | ||
| "type": "collection", | ||
| "id": "collection", | ||
| "label": "Collection" | ||
| }, | ||
| { | ||
| "type": "text", | ||
| "id": "collection_text", | ||
| "label": "Collection Display Text", | ||
| "info": "Defaults to collection name if empty" | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "video", | ||
| "name": "Video", | ||
| "settings": [ | ||
| { | ||
| "type": "image_picker", | ||
| "id": "cover_image", | ||
| "label": "Video Cover Image" | ||
| }, | ||
| { | ||
| "type": "video_url", | ||
| "id": "video_url", | ||
| "accept": ["youtube", "vimeo"], | ||
| "default": "https://www.youtube.com/watch?v=_9VUPq3SxOc", | ||
| "label": "Video URL", | ||
| "info": "Enter the video URL" | ||
| } | ||
| ] | ||
| } | ||
| ], | ||
| "max_blocks": 3, | ||
| "presets": [ | ||
| { | ||
| "name": "Custom Collage", | ||
| "blocks": [ | ||
| { | ||
| "type": "image" | ||
| }, | ||
| { | ||
| "type": "product" | ||
| }, | ||
| { | ||
| "type": "collection" | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| } | ||
| {% endschema %} | ||
Oops, something went wrong.