{% set compounds_types_links = compoundLocationSubLinks() %}
{% set isCompoundsLinks = compounds_types_links is defined %}
{% set isMobile = (isMobile is defined) ? isMobile : isMobileAgent(app.request.headers.get('User-Agent')) %}
{% set seeMoreClass = isMobile ? '' : 'large-element' %}
{% set maxCollapsedHeight = 52 %}
{% set compoundSubLocationHeader = get_setting('general', 'country') == 'SA' ? 'layout.country_projects_quick_links_main_title'|trans({'%country%': country}) : 'layout.projects_quick_links_main_title'|trans %}
{% if get_setting('general', 'country')|lower == 'eg' %}
{% set country = 'layout.countries.egypt'|trans %}
{% else %}
{% set country = 'layout.countries.ksa'|trans %}
{% endif %}
{% if isCompoundsLinks %}
<div class="page-header">
<h3>
{{ compoundSubLocationHeader }}
</h3>
</div>
<div class="chips-links sub-location-container large-element-parent">
<div class="clearfix {{seeMoreClass}} noScrollIntoView" {% if isMobile %} always-show="true" {% endif %} data-height="{{ maxCollapsedHeight }}">
<ul class="chips-links__list {% if not isMobile %} no-scroll {% endif %}">
{% for sub_type in compounds_types_links %}
<li class="col-md-3 col-xs-6 chips-links__item">
<a class="chips-links__link"
href="{{ url(sub_type.route, sub_type.routeParameters) }}"
alt="{{ sub_type.label }}">
{{ sub_type.title }} ({{ sub_type.listingsCount }})
</a>
</li>
{% endfor %}
</ul>
</div>
{% if not isMobile %}
<a href="javascript:void(0)" id="seeMoreParagraph" class="see-more-custom-paragraph see-more-paragraph-button px-3 mb-5"
data-seeMore="{{ 'listing.see_more'|trans }}" data-seeLess="{{ 'listing.see_less'|trans }}"></a>
{% endif %}
</div>
{% endif %}