{% extends 'template.html' %}

{% block css %}
<link rel="stylesheet" href="{{ url_for('static', filename='e_blog/a_all_posts.css') }}">
{% endblock css %}

{% block navbar %}
{% include 'z_comps/navbar.html' %}
{% endblock navbar %}

{% block body %}

<form method="get" class="mb-4">
  <div class="input-group">
    <input type="text" class="form-control" name="q" placeholder="Buscar título, autor o contenido..." value="{{ search }}">
    <button class="btn btn-outline-primary" type="submit">
      <i class="bi bi-search"></i> Buscar
    </button>
  </div>
</form>


<div class="container">

    <!-- {# i pagination #} -->
    <nav aria-label="Page navigation">
      <ul class="pagination justify-content-center mt-4">
    
        <!-- Anterior -->
        <li class="page-item {% if current_page <= 1 %}disabled{% endif %}">
          <a class="page-link" href="?page={{ current_page - 1 }}{% if search %}&q={{ search }}{% endif %}">Anterior</a>
        </li>
    
        <!-- Páginas -->
        {% for page_num in range(1, total_pages + 1) %}
        <li class="page-item {% if page_num == current_page %}active{% endif %}">
          <a class="page-link" href="?page={{ page_num }}{% if search %}&q={{ search }}{% endif %}">
            {{ page_num }}
          </a>
        </li>
        {% endfor %}
  
        <!-- Siguiente -->
        <li class="page-item {% if current_page >= total_pages %}disabled{% endif %}">
          <a class="page-link" href="?page={{ current_page + 1 }}{% if search %}&q={{ search }}{% endif %}">Siguiente</a>
        </li>
    
      </ul>
    </nav>
    <!-- {# f pagination #} -->

  <div class="row">
    {% for post in data %}
    <div class="col-12 col-sm-8 col-md-6 col-lg-4">
      <div class="card" data-aos="fade-up" data-aos-delay="0" data-aos-duration="800">
        
        <img class="card-img" src="{{ post[7] if post[7] else url_for('static', filename='y_img/other/no_img.png') }}" alt="">        
        
        <!-- <div class="card-img-overlay"><a href="#" class="btn btn-light btn-sm">Cooking</a></div> -->
        <div class="card-body">
          <h4 class="card-title">
            <a href="{{ url_for('blog_post', post_id = post[0] ) }}" class="btn btn-info">
              {{ post[5] }} <!-- {# título #} -->
            </a>
          </h4>
          <small class="text-muted cat">
            <!-- {# autor #} -->
            <i class="bi bi-person-circle"></i> {{ post[1] }} {{ post[2] }} <br>
            <i class="bi bi-clock-history"></i> {{ post[8] }} Min.
            <!-- <i class="far fa-clock text-info"></i> 30 minutes -->
            <!-- <i class="fas fa-users text-info"></i> 4 portions -->
          </small>
          <!-- {# breve contenido #} -->
          <p class="card-text">{{ post[6] }}...</p>
          <!-- <a href="{{ post[0] }}" class="btn btn-info">
            <i class="bi bi-eye-fill"></i>
          </a> -->
        </div>
        <div class="card-footer text-muted d-flex justify-content-between bg-transparent border-top-0">
          <div class="views">
            <i class="bi bi-vector-pen"></i> {{ post[3] }}
            {% if post[4] is not none  %}
            <i class="bi bi-arrow-repeat"></i> {{ post[4] }}
            {% endif %}
          </div>
          <!-- {# 
           <div class="stats">
            <i class="bi bi-eye-fill"></i> No. Vistas
            <i class="far fa-comment"></i> 12
          </div>
            #} -->
        </div>
      </div>
    </div>
    {% endfor %}
  </div>
  <!-- {# i pagination #} -->
  <nav aria-label="Page navigation">
    <ul class="pagination justify-content-center mt-4">
  
      <!-- Anterior -->
      <li class="page-item {% if current_page <= 1 %}disabled{% endif %}">
        <a class="page-link" href="?page={{ current_page - 1 }}{% if search %}&q={{ search }}{% endif %}">Anterior</a>
      </li>
  
      <!-- Páginas -->
      {% for page_num in range(1, total_pages + 1) %}
      <li class="page-item {% if page_num == current_page %}active{% endif %}">
        <a class="page-link" href="?page={{ page_num }}{% if search %}&q={{ search }}{% endif %}">
          {{ page_num }}
        </a>
      </li>
      {% endfor %}

      <!-- Siguiente -->
      <li class="page-item {% if current_page >= total_pages %}disabled{% endif %}">
        <a class="page-link" href="?page={{ current_page + 1 }}{% if search %}&q={{ search }}{% endif %}">Siguiente</a>
      </li>
  
    </ul>
  </nav>
  <!-- {# f pagination #} -->

</div>



{% endblock body %}

{% block js %}

<!-- {# aos script #} -->
{% include 'z_comps/aos_script.html' %}

{% endblock js %}