Refund policy
{% doc %}
@prompt
i need A tab Like How customers Do exchanges And Returns, Add Some icons
{% enddoc %}
{% assign ai_gen_id = block.id | replace: '_', '' | downcase %}
{% style %}
.ai-exchange-returns-tabs-{{ ai_gen_id }} {
max-width: 100%;
padding: 40px 20px;
}
.ai-exchange-returns-tabs__container-{{ ai_gen_id }} {
max-width: 800px;
margin: 0 auto;
}
.ai-exchange-returns-tabs__heading-{{ ai_gen_id }} {
text-align: center;
margin-bottom: 30px;
font-size: {{ block.settings.heading_size }}px;
color: {{ block.settings.heading_color }};
}
.ai-exchange-returns-tabs__tab-list-{{ ai_gen_id }} {
display: flex;
gap: 10px;
margin-bottom: 30px;
border-bottom: 2px solid {{ block.settings.border_color }};
flex-wrap: wrap;
}
.ai-exchange-returns-tabs__tab-button-{{ ai_gen_id }} {
padding: 12px 24px;
background: none;
border: none;
border-bottom: 3px solid transparent;
cursor: pointer;
font-size: {{ block.settings.tab_font_size }}px;
color: {{ block.settings.tab_text_color }};
transition: all 0.3s ease;
position: relative;
bottom: -2px;
display: flex;
align-items: center;
gap: 8px;
}
.ai-exchange-returns-tabs__tab-icon-{{ ai_gen_id }} {
width: {{ block.settings.icon_size }}px;
height: {{ block.settings.icon_size }}px;
flex-shrink: 0;
}
.ai-exchange-returns-tabs__tab-button-{{ ai_gen_id }}:hover {
color: {{ block.settings.tab_active_color }};
}
.ai-exchange-returns-tabs__tab-button-{{ ai_gen_id }}:hover .ai-exchange-returns-tabs__tab-icon-{{ ai_gen_id }} {
stroke: {{ block.settings.tab_active_color }};
}
.ai-exchange-returns-tabs__tab-button-{{ ai_gen_id }}.active {
color: {{ block.settings.tab_active_color }};
border-bottom-color: {{ block.settings.tab_active_color }};
font-weight: 600;
}
.ai-exchange-returns-tabs__tab-button-{{ ai_gen_id }}.active .ai-exchange-returns-tabs__tab-icon-{{ ai_gen_id }} {
stroke: {{ block.settings.tab_active_color }};
}
.ai-exchange-returns-tabs__content-{{ ai_gen_id }} {
display: none;
padding: 30px;
background-color: {{ block.settings.content_bg_color }};
border-radius: {{ block.settings.content_border_radius }}px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.ai-exchange-returns-tabs__content-{{ ai_gen_id }}.active {
display: block;
}
.ai-exchange-returns-tabs__content-title-{{ ai_gen_id }} {
font-size: {{ block.settings.content_title_size }}px;
color: {{ block.settings.content_text_color }};
margin-bottom: 15px;
font-weight: 600;
}
.ai-exchange-returns-tabs__content-text-{{ ai_gen_id }} {
font-size: {{ block.settings.content_text_size }}px;
color: {{ block.settings.content_text_color }};
line-height: 1.6;
}
.ai-exchange-returns-tabs__content-text-{{ ai_gen_id }} ul,
.ai-exchange-returns-tabs__content-text-{{ ai_gen_id }} ol {
margin: 15px 0;
padding-left: 20px;
}
.ai-exchange-returns-tabs__content-text-{{ ai_gen_id }} li {
margin-bottom: 8px;
}
.ai-exchange-returns-tabs__content-text-{{ ai_gen_id }} p {
margin-bottom: 15px;
}
@media screen and (max-width: 749px) {
.ai-exchange-returns-tabs__tab-list-{{ ai_gen_id }} {
flex-direction: column;
gap: 0;
}
.ai-exchange-returns-tabs__tab-button-{{ ai_gen_id }} {
width: 100%;
text-align: left;
border-bottom: 1px solid {{ block.settings.border_color }};
}
.ai-exchange-returns-tabs__tab-button-{{ ai_gen_id }}.active {
border-left: 3px solid {{ block.settings.tab_active_color }};
border-bottom: 1px solid {{ block.settings.border_color }};
padding-left: 21px;
}
.ai-exchange-returns-tabs__content-{{ ai_gen_id }} {
padding: 20px;
}
}
{% endstyle %}
{% if block.settings.heading != blank %}
(function() {
class ExchangeReturnsTabs{{ ai_gen_id }} extends HTMLElement {
constructor() {
super();
}
connectedCallback() {
this.tabButtons = this.querySelectorAll('.ai-exchange-returns-tabs__tab-button-{{ ai_gen_id }}');
this.tabContents = this.querySelectorAll('.ai-exchange-returns-tabs__content-{{ ai_gen_id }}');
this.setupEventListeners();
}
setupEventListeners() {
this.tabButtons.forEach((button) => {
button.addEventListener('click', () => {
const tabName = button.getAttribute('data-tab');
this.switchTab(tabName);
});
});
}
switchTab(tabName) {
this.tabButtons.forEach((button) => {
const isActive = button.getAttribute('data-tab') === tabName;
button.classList.toggle('active', isActive);
button.setAttribute('aria-selected', isActive);
});
this.tabContents.forEach((content) => {
const isActive = content.getAttribute('data-content') === tabName;
content.classList.toggle('active', isActive);
});
}
}
customElements.define('exchange-returns-tabs-{{ ai_gen_id }}', ExchangeReturnsTabs{{ ai_gen_id }});
})();
{% schema %}
{
"name": "Exchange and returns tabs",
"tag": null,
"settings": [
{
"type": "header",
"content": "General"
},
{
"type": "inline_richtext",
"id": "heading",
"label": "Heading",
"default": "Exchanges & Returns"
},
{
"type": "range",
"id": "heading_size",
"min": 16,
"max": 48,
"step": 2,
"unit": "px",
"label": "Heading size",
"default": 32
},
{
"type": "color",
"id": "heading_color",
"label": "Heading color",
"default": "#121212"
},
{
"type": "header",
"content": "Tab labels"
},
{
"type": "text",
"id": "exchanges_tab_label",
"label": "Exchanges tab",
"default": "Exchanges"
},
{
"type": "text",
"id": "returns_tab_label",
"label": "Returns tab",
"default": "Returns"
},
{
"type": "checkbox",
"id": "show_policy_tab",
"label": "Show policy tab",
"default": true
},
{
"type": "text",
"id": "policy_tab_label",
"label": "Policy tab",
"default": "Policy"
},
{
"type": "header",
"content": "Exchanges content"
},
{
"type": "inline_richtext",
"id": "exchanges_title",
"label": "Title",
"default": "How to Exchange"
},
{
"type": "richtext",
"id": "exchanges_content",
"label": "Content",
"default": "{{ block.settings.heading }}
{% endif %}
{{ block.settings.exchanges_tab_label }}
{{ block.settings.returns_tab_label }}
{% if block.settings.show_policy_tab %}
{{ block.settings.policy_tab_label }}
{% endif %}
{% if block.settings.exchanges_title != blank %}
{{ block.settings.exchanges_title }}
{% endif %}
{{ block.settings.exchanges_content }}
{% if block.settings.returns_title != blank %}
{% if block.settings.show_policy_tab %}
{{ block.settings.returns_title }}
{% endif %}
{{ block.settings.returns_content }}
{% if block.settings.policy_title != blank %}
{% endif %}
{{ block.settings.policy_title }}
{% endif %}
{{ block.settings.policy_content }}
To exchange an item, please follow these steps:
- Contact our customer service team within 30 days of receiving your order
- Provide your order number and the item you wish to exchange
- We'll send you a prepaid return label
- Ship the item back to us in its original condition
- Once we receive your return, we'll send out your exchange
We accept returns within 30 days of purchase. Here's how:
- Ensure the item is unused and in its original packaging
- Contact our support team to initiate a return
- Print the return label we send you
- Pack the item securely and attach the label
- Drop off at your nearest shipping location
- Refunds are processed within 5-7 business days after we receive your return
Eligibility:
- Items must be returned within 30 days of delivery
- Products must be unused and in original condition
- Original packaging and tags must be intact
Non-returnable items:
- Final sale items
- Personalized or custom products
- Opened hygiene products