portfolio_web/jirikarlik/templates/portfolio_item.html

66 lines
2.0 KiB
HTML

{% extends "base.html" %}
{% block main %}
<main class="main">
<!-- Page Title -->
<div class="page-title" data-aos="fade">
<div class="container d-lg-flex justify-content-between align-items-center">
<h1 class="mb-2 mb-lg-0">{{name}}</h1>
<nav class="breadcrumbs">
<ol>
<li><a href="../index.html">Home</a></li>
<li class="current">{{name}}</li>
</ol>
</nav>
</div>
</div><!-- End Page Title -->
<!-- Portfolio Details Section -->
<section id="portfolio-details" class="portfolio-details section">
<div class="container" data-aos="fade-up">
<div class="portfolio-details-slider swiper init-swiper">
<script type="application/json" class="swiper-config">
{
"loop": true,
"speed": 600,
"autoplay": {
"delay": 5000
},
"slidesPerView": "auto",
"navigation": {
"nextEl": ".swiper-button-next",
"prevEl": ".swiper-button-prev"
},
"pagination": {
"el": ".swiper-pagination",
"type": "bullets",
"clickable": true
}
}
</script>
<div class="swiper-wrapper align-items-center">
{% for img in imgs %}
<span class="closebtn" onclick="this.parentElement.style.display='none';">{{ message }}</span>
<div class="swiper-slide">
<img src="{{ img }}" alt="{{ name }} image"/>
</div>
{% endfor %}
</div>
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
<div class="swiper-pagination"></div>
</div>
{% block desc%}
<h2>Desc Missing</h2>
{% endblock %}
</div>
</section><!-- /Portfolio Details Section -->
</main>
{% endblock %}