{% sw_extends "@Storefront/storefront/layout/header/top-bar.html.twig" %}
{% block layout_header_top_bar %}
{% set items = [{
show: theme_config('atl-header-top-bar-show-label-one') == 'true',
classes: 'd-flex',
icon: theme_config('atl-header-top-bar-label-icon-one'),
label: "atl-katana-theme.header.top-bar.labelOne"|trans|sw_sanitize
}, {
show: theme_config('atl-header-top-bar-show-label-two') == 'true',
classes: 'd-none d-md-flex',
icon: theme_config('atl-header-top-bar-label-icon-two'),
label: "atl-katana-theme.header.top-bar.labelTwo"|trans|sw_sanitize
}, {
show: theme_config('atl-header-top-bar-show-label-three') == 'true',
classes: 'd-none d-lg-flex',
icon: theme_config('atl-header-top-bar-label-icon-three'),
label: "atl-katana-theme.header.top-bar.labelThree"|trans|sw_sanitize
}, {
show: theme_config('atl-header-top-bar-show-label-four') == 'true',
classes: 'd-none d-xl-flex',
icon: theme_config('atl-header-top-bar-label-icon-four'),
label: "atl-katana-theme.header.top-bar.labelFour"|trans|sw_sanitize
}] %}
{% set googleMapsApiKey = config('AtlKatanaTheme.config.googleMapsApiKey') %}
{% set googleMapsPlaceId = config('AtlKatanaTheme.config.googleMapsPlaceId') %}
{% set loadGoogleMapsLib = config('AtlKatanaTheme.config.loadGoogleMapsLib') %}
<nav class="top-bar {{ theme_config('atl-header-show-top-bar-at') }}">
<div class="container">
<div class="row">
{% block layout_header_top_bar_inner %}
<div class="col-12 d-flex justify-content-center{% if theme_config('atl-header-top-bar-alignment') == 'space-between' %} justify-content-md-around justify-content-lg-between{% elseif theme_config('atl-header-top-bar-alignment') == 'flex-end' %} justify-content-md-end{% endif %}">
{% block layout_header_top_bar_social_service %}
{% if theme_config('atl-header-top-bar-social-media') == 'left' or theme_config('atl-header-top-bar-service-menu') == 'list' and page.header.serviceMenu.count > 0 %}
<div class="top-bar-item-first d-none d-md-block">
<div class="d-flex align-items-center h-100">
{% block layout_header_top_bar_social %}
{% if theme_config('atl-header-top-bar-social-media') == 'left' %}
<div class="top-bar-social-media pr-3">
{% sw_include '@Storefront/storefront/skin/global/component/social/social-media.html.twig' with {
'size': 'xs'
} %}
</div>
{% endif %}
{% endblock %}
{% block layout_header_top_bar_service_list %}
{% if theme_config('atl-header-top-bar-service-menu') == 'list' %}
<div class="d-none d-md-block">
{% apply spaceless %}
<ul class="d-flex list-unstyled h-100 m-0">
{% for serviceMenuItem in page.header.serviceMenu %}
{% block layout_header_top_bar_service_list_item %}
<li class="top-bar-item">
<a class="text-decoration-none"
href="{{ category_url(serviceMenuItem) }}"
{% if category_linknewtab(serviceMenuItem) %}target="_blank"{% endif %}
title="{{ serviceMenuItem.translated.name }}">
{{ serviceMenuItem.translated.name }}
</a>
</li>
{% endblock %}
{% endfor %}
</ul>
{% endapply %}
</div>
{% endif %}
{% endblock %}
</div>
</div>
{% endif %}
{% endblock %}
{% block layout_header_top_bar_items %}
{% for item in items %}
{% if item.show %}
<div class="{{ item.classes }} top-bar-item">
{% if loop.index == 2 and googleMapsApiKey and googleMapsPlaceId and loadGoogleMapsLib %}
{% sw_include '@AtlKatanaTheme/storefront/skin/global/component/ratings/google.html.twig' with {
googleMapsApiKey: googleMapsApiKey,
googleMapsPlaceId: googleMapsPlaceId
} %}
{% else %}
{% block layout_header_top_bar_item %}
{% if item.icon %}
{% sw_include '@Storefront/storefront/utilities/icon.html.twig' with {
name: item.icon,
namespace: 'AtlKatanaTheme',
'pack': theme_config('atl-icon-set'),
'size': 'xs'
} %}
{% endif %}
<span>
{{ item.label|raw }}
</span>
{% endblock %}
{% endif %}
</div>
{% endif %}
{% endfor %}
{% endblock %}
{% block layout_header_top_bar_widgets %}
{% if page.header.currencies.count > 1 or page.header.languages.count > 1 or theme_config('atl-header-top-bar-service-menu') == 'dropdown' and page.header.serviceMenu.count > 0 %}
<div class="d-none d-md-block">
<div class="top-bar-widgets">
{% block layout_header_top_bar_currency %}
{% sw_include '@Storefront/storefront/layout/header/actions/currency-widget.html.twig' %}
{% endblock %}
{% block layout_header_top_bar_language %}
{% sw_include '@Storefront/storefront/layout/header/actions/language-widget.html.twig' %}
{% endblock %}
{% block layout_header_top_bar_service %}
{% if theme_config('atl-header-top-bar-service-menu') == 'dropdown' %}
{% sw_include '@Storefront/storefront/layout/header/actions/service-menu-widget.html.twig' %}
{% endif %}
{% endblock %}
</div>
</div>
{% endif %}
{% endblock %}
</div>
{% endblock %}
</div>
</div>
</nav>
{% endblock %}