jpscontracting/templates/project_category.html

120 lines
5.3 KiB
HTML

{% include 'blocks/head.html' %}
<!-- Header -->
{% include 'blocks/header.html' %}
<!-- Header -->
<!-- Main Content -->
<main id="main-content">
<div class="main-section">
<section class="page-section" style="padding:30px 0 0;">
<div class="container">
<div class="row">
<div class="section-fullwidth">
<div class="element-size-100">
<div class="px-project-block">
<div class="col-md-12">
<div class="px-section-title">
<h3>{{ category }}</h3>
<span></span>
</div>
<div class="element-size-100">
<ul>
{% for item in projects %}
<li>
{{ item }}
</li>
{% endfor %}
</ul>
</div>
<div class="element-size-100">
<div class="px-portfolio px-portfolio-masonary">
<ul class="portfolio-items col-3">
<li class="portfolio-item Deck col-md-3">
<div class="item-main">
<div class="portfolio-image">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</main>
<!-- jQuery (necessary for JavaScript plugins) -->
<script src="{{ url_for('static', filename='scripts/jquery.js') }}"></script>
<script src="{{ url_for('static', filename='scripts/bootstrap.min.js') }}"></script>
<script src="{{ url_for('static', filename='scripts/modernizr.js') }}"></script>
<script src="{{ url_for('static', filename='scripts/jquery.flexslider-min.js') }}"></script>
<script src="{{ url_for('static', filename='scripts/owl.carousel.min.js') }}"></script>
<script src="{{ url_for('static', filename='scripts/sticky_header.js') }}"></script>
<script src="{{ url_for('static', filename='scripts/jquery.nicescroll.min.js') }}"></script>
<script src="{{ url_for('static', filename='scripts/functions.js') }}"></script>
<script type="text/javascript">
$(window).load(function() {
$('#carousel').flexslider({
animation: "slide",
prevText:"<em class='icon-arrow-left9'></em>",
nextText:"<em class='icon-arrow-right9'></em>",
controlNav: true,
animationLoop: false,
slideshow: false,
itemWidth: 142,
itemMargin: 20,
asNavFor: '#slider'
});
$('#slider').flexslider({
animation: "slide",
controlNav: false,
animationLoop: false,
slideshow: false,
sync: "#carousel"
});
});
</script>
<script type="text/javascript">
$('.px-portfolio-carousel').owlCarousel({
nav: true,
margin: 5,
navText: [
"<i class=' icon-angle-left'></i>",
"<i class='icon-angle-right'></i>"
],
responsive: {
0: {
items: 1 // In this configuration 1 is enabled from 0px up to 479px screen size
},
480: {
items: 2, // from 480 to 677
nav: false // from 480 to max
},
678: {
items: 3, // from this breakpoint 678 to 959
center: false // only within 678 and next - 959
},
960: {
items: 3, // from this breakpoint 960 to 1199
center: false,
loop: false
},
1200: {
items: 3,
}
}
});
</script>
<!-- Main Content -->
<!-- Footer -->
{% include 'blocks/footer.html' %}
<!-- Footer -->
{% include 'blocks/foot.html' %}