-
Notifications
You must be signed in to change notification settings - Fork 0
/
skio-app-block.liquid
45 lines (41 loc) · 2.03 KB
/
skio-app-block.liquid
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
{% comment %}
Usage:
{% when 'skio-plan-picker' %}
{% render 'skio-app-block', block: block, product: product %}
{% endcomment %}
{% assign skioSellingPlanGroups = product.selling_plan_groups | where: 'app_id', 'SKIO' %}
{% assign skioRender = false %}
{% if block.settings.product_handle != null or block.settings.product_handle == null and skioSellingPlanGroups.size > 0 and product.available %}
{% assign skioRender = true %}
{% endif %}
{% if skioRender %}
<style>
skio-plan-picker {
--skio-group-border-radius: {{ block.settings.group_border_radius }}px;
--skio-group-border-width: {{ block.settings.group_border_width }}px;
--skio-group-border-color: {{ block.settings.group_border_color }};
--skio-group-border-selected-color: {{ block.settings.group_border_selected_color }};
--skio-group-background-color: {{ block.settings.group_background_color }};
--skio-group-background-selected-color: {{ block.settings.selected_group_background_color }};
--skio-group-text-color: {{ block.settings.group_text_color }};
--skio-group-text-selected-color: {{ block.settings.group_selected_text_color }};
--skio-discount-color: {{ block.settings.discount_color }};
--skio-discount-text-color: {{ block.settings.discount_text_color }};
--skio-button-plan-selector-width: {{ block.settings.button_plan_selector_width }};
}
</style>
<{{ block.settings.element_name }}
key='{{ block.id }}'
options='{{ block.settings | json | escape }}'
layout='{{ block.settings.layout }}'
{% if block.settings.product_handle != null %}
productHandle='{{ block.settings.product_handle }}'
{% else %}
product='{{ product | json | escape }}'
selectedVariant='{{ product.selected_or_first_available_variant | json | escape }}'
{% endif %}
>
<input type='hidden' name='selling_plan' form='{{ block.settings.form_id }}'>
</{{ block.settings.element_name }}>
<script src='{{ 'skio-plan-picker-component.js' | asset_url }}' type='module'></script>
{% endif %}