initial commit
This commit is contained in:
@@ -0,0 +1,108 @@
|
||||
{%- assign disclosure_surface = surface | default: 'product_page' -%}
|
||||
{%- assign disclosures = product.metafields.shopify.disclosure.value -%}
|
||||
{%- assign summary_html = '' -%}
|
||||
{%- assign details_html = '' -%}
|
||||
{%- assign rendered_disclosures_count = 0 -%}
|
||||
|
||||
{%- if disclosures != blank -%}
|
||||
{%- for disclosure in disclosures -%}
|
||||
{%- assign surfaces = disclosure.display_preferences.value.surfaces -%}
|
||||
|
||||
{%- if surfaces contains disclosure_surface -%}
|
||||
{%- assign title = disclosure.title.value -%}
|
||||
{%- assign img = disclosure.symbol.value -%}
|
||||
{%- assign content = disclosure.content -%}
|
||||
|
||||
{%- capture summary_item -%}
|
||||
{%- if rendered_disclosures_count > 0 -%}
|
||||
<span class="disclosures-separator">•</span>
|
||||
{%- endif -%}
|
||||
<span class="disclosures-summary-item">
|
||||
{%- if img != blank -%}
|
||||
<img
|
||||
src="{{ img | image_url: width: 40 }}"
|
||||
srcset="{{ img | image_url: width: 20 }} 1x, {{ img | image_url: width: 40 }} 2x, {{ img | image_url: width: 60 }} 3x"
|
||||
alt=""
|
||||
class="disclosures__icon"
|
||||
width="40"
|
||||
height="31"
|
||||
loading="lazy"
|
||||
>
|
||||
{%- endif -%}
|
||||
<span class="disclosures-summary-item__title">{{ title }}</span>
|
||||
<span class="disclosures-summary-item__open-title">{{ title }}</span>
|
||||
</span>
|
||||
{%- endcapture -%}
|
||||
|
||||
{%- capture details_item -%}
|
||||
<div class="disclosures-item">
|
||||
{%- if rendered_disclosures_count > 0 -%}
|
||||
{%- if title != blank or img != blank -%}
|
||||
<div class="disclosures-item__header">
|
||||
{%- if img != blank -%}
|
||||
<img
|
||||
src="{{ img | image_url: width: 40 }}"
|
||||
srcset="{{ img | image_url: width: 20 }} 1x, {{ img | image_url: width: 40 }} 2x, {{ img | image_url: width: 60 }} 3x"
|
||||
alt=""
|
||||
class="disclosures__icon"
|
||||
width="40"
|
||||
height="31"
|
||||
loading="lazy"
|
||||
>
|
||||
{%- endif -%}
|
||||
{%- if title != blank -%}
|
||||
<span>{{ title }}</span>
|
||||
{%- endif -%}
|
||||
</div>
|
||||
{%- endif -%}
|
||||
{%- endif -%}
|
||||
|
||||
<div class="disclosures-item__content">
|
||||
{{ content | metafield_tag }}
|
||||
</div>
|
||||
</div>
|
||||
{%- endcapture -%}
|
||||
|
||||
{%- capture summary_html -%}{{ summary_html }}{{ summary_item }}{%- endcapture -%}
|
||||
{%- capture details_html -%}{{ details_html }}{{ details_item }}{%- endcapture -%}
|
||||
{%- assign rendered_disclosures_count = rendered_disclosures_count | plus: 1 -%}
|
||||
{%- endif -%}
|
||||
{%- endfor -%}
|
||||
{%- endif -%}
|
||||
|
||||
{%- if rendered_disclosures_count > 0 -%}
|
||||
{{ 'component-disclosures.css' | asset_url | stylesheet_tag }}
|
||||
|
||||
<div
|
||||
class="disclosures spacing-style"
|
||||
{% if block != blank %}
|
||||
{{ block.shopify_attributes }}
|
||||
{% endif %}
|
||||
>
|
||||
{%- if heading != blank -%}
|
||||
<h3 class="disclosures__heading {{ heading_size }}">
|
||||
{{ heading | escape }}
|
||||
</h3>
|
||||
{%- endif -%}
|
||||
|
||||
<details
|
||||
class="disclosures__details"
|
||||
{% if open_by_default %}
|
||||
open
|
||||
{% endif %}
|
||||
>
|
||||
<summary class="disclosures__summary">
|
||||
<div class="disclosures__summary-content">
|
||||
{{ summary_html }}
|
||||
</div>
|
||||
{{- 'icon-caret.svg' | inline_asset_content -}}
|
||||
</summary>
|
||||
|
||||
<disclosures-content class="disclosures__content">
|
||||
{{ details_html }}
|
||||
</disclosures-content>
|
||||
</details>
|
||||
</div>
|
||||
|
||||
<script src="{{ 'disclosures.js' | asset_url }}" defer="defer"></script>
|
||||
{%- endif -%}
|
||||
Reference in New Issue
Block a user