<section class="all-project-showcase">
	<div class="container-fluid">
		<div class="tabs">
			<div class="row justify-center">
				<div class="col-md-12 col-xl-10 col-xxl-8">
					<ul class="all-project-showcase__list">
						<li>
							<a href="{{ term_links[0] }}" class="h5 tabs__item all-project-showcase__list-item {{ not fields.project_category ? "active" : "" }} ">All projects</a>
						</li>
						{% for item in taxonomy_terms %}
							{% if item.count > 0 %}
								<li>
									<a href="{{ term_links[loop.index] }}" class="h5 tabs__item all-project-showcase__list-item {{ item.term_id == fields.project_category ? "active" : "" }}">{{ item.name }}</a>
								</li>
							{% endif %}
						{% endfor %}
					</ul>
				</div>

			</div>
			<div class="all-project-showcase__project">
				<div class="tabs__wrap all-project-showcase__wrap">
					{% for post in posts %}
						<div class="row justify-center">
							<a href="{{ post.link }}" class="all-project-showcase__item col-md-12 col-xl-10 col-xxl-8">
								<div class="col-md-6">
									<div class="all-project-showcase__item-img">
										<img src="{{ post.thumbnail.src }}" alt="{{ post.thumbnail.alt }}">
									</div>
								</div>

								<div class="col-md-6">
									<div class="d-flex align-center all-project-showcase__item-bg">
										<div class="all-project-showcase__item-content">
											<div class="all-project-showcase__item-tag">
												{% for type in post.get_terms('delta_project_type') %}
														<p>{{ type.name }}</p>
												{% endfor %}
												{% for branch in post.get_terms('delta_project_branch') %}
														<p>{{ branch.name }}</p>
												{% endfor %}
											</div>

											<h3 class="all-project-showcase__item-title">{{ post.title }}</h3>

											<div class="all-project-showcase__item-text">
												<p>{{ post.post_excerpt }}</p>
											</div>
										</div>

										<span class="all-project-showcase__item-arrow"><img src="{{ function('get_frontend_static_asset', 'assets/images/arrow-right-short-svgrepo-com.svg') }}" alt="arrow"></span>
									</div>
								</div>
							</a>
						</div>
					{% endfor %}

					{% if posts.pagination.pages %}
						<div class="col-12 all-project-showcase__pagination js-pagination" data-ppp="{{ fields.posts_per_page }}">
							<a href="{{ posts.pagination.prev ? posts.pagination.prev.link : "" }}" class="blog-list__pagination-arrow blog-list__pagination-arrow--left {{posts.pagination.prev.link|length ? '' : 'blog-list__pagination-arrow--disabled'}}">
								<img src="{{ function("get_frontend_static_asset", "assets/images/pag-arrow.svg") }}" alt="{{ t('Pagination left arrow') }}">
							</a>

							{% for page in posts.pagination.pages %}
								{% if page.link %}
									<a href="{{page.link}}" class="page-num">{{page.title}}</a>
								{% else %}
									<span class="page-num active">{{page.title}}</span>
								{% endif %}
							{% endfor %}

							<a href="{{ posts.pagination.next ? posts.pagination.next.link : "" }}" class="blog-list__pagination-arrow {{posts.pagination.next.link|length ? '' : 'blog-list__pagination-arrow--disabled'}}">
								<img src="{{ function("get_frontend_static_asset", "assets/images/pag-arrow.svg") }}" alt="{{ t('Pagination right arrow') }}">
							</a>
						</div>
					{% endif %}

				</div>
			</div>
		</div>
	</div>
</section>