{% extends "base.html" %}
{% load static %}
{% block content %}
<main class="main-body">
<section class="inner-banner" style="background: url('{% static 'images/inner-banner.png' %}')">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-6 col-md-offset-3 col-lg-6 col-lg-offset-3">
<div class="inner-banner-box">
<div class="inner-banner-text">
<h1>Blogs</h1>
</div>
</div>
</div>
</div>
</div>
</section>
<div class="clearfix"></div>
<section class="blog-section">
<div class="container">
<div class="row">
{% if blog_list %}
{% for list in blog_list %}
<div class="col-xs-12 col-sm-4 col-md-4 col-lg-4">
<a href="{% url 'blog_details' list.id %}">
<div class="blog-box blog-height">
<div class="blog-box-img"> <img src="{% static 'upload/' %}{% if list.blog_image %}{{ list.blog_image }}{% else %}no_image.jpg{% endif %}" class="img-responsive" alt="">
<div class="blog-img-overlay"> <span class="blog-date">{{ list.blog_created_date|date:'d' }}</span> <span class="date-month">{{ list.blog_created_date|date:'F' }}</span> </div>
</div>
<div class="blog-box-text">
<h3>{{ list.blog_title }}</h3>
<p>{{ list.blog_description }}</p>
</div>
</div>
</a>
</div>
{% endfor %}
{% else %}
<p class="text-center">No records found</p>
{% endif %}
{% if blog_list %}
<div class="row">
<div class="col-xs-12 col-md-12 text-center">
{% if blog_list.has_previous %}
<a class="view-all-btn" href="?page={{ blog_list.previous_page_number }}"><i class="fa fa-long-arrow-left" aria-hidden="true"></i> Previous</a>
<a class="view-all-btn-disabled" title = "No Posts available">Next <i class="fa fa-long-arrow-right" aria-hidden="true"></i></a>
{% endif %}
{% if blog_list.has_next %}
<a class="view-all-btn-disabled" title = "No Posts available"><i class="fa fa-long-arrow-left" aria-hidden="true"></i> Previous</a>
<a class="view-all-btn" href="?page={{ blog_list.next_page_number }}">Next <i class="fa fa-long-arrow-right" aria-hidden="true"></i></a>
{% endif %}
</div>
</div>
{% endif %}
</div>
</div>
</section>
<div class="clearfix"></div>
<a href="#" class="scrollup"><i class="fa fa-long-arrow-up" aria-hidden="true"></i></a> </main>
{% endblock %}
</body>
</html>