pokercc/news/templates/news/index.html

{% extends "base.html" %}

{% load static %}

{% block title %}My amazing blog{% endblock %}

{% block content %}
{% if latest_post_list %}

    {% for post in latest_post_list %}

<!-- <div class="{% if forloop.counter|divisibleby:2 %}even{% else %}odd{% endif %}"> -->

  <article>

    <div class="postintro lat_padding">
      {{ post.date }} - {{ post.author.username }}
    </div>

    <!-- A post -->
      {% if post.style == 0 %}

        <div class="imgcontainer">
          <img src="{% static 'media/' %}{{ post.image_url }}"/>
          <div class="inside_image_top">
            {% if post.url %}<a href="{{ post.url }}">{% endif %}
              <h1>{{ post.title }}</h1>
            {% if post.url %}</a>{% endif %}
            <p>
              {{ post.body }}
            </p>
          </div>

          <div class="inside_image_bottom">

            <div class="info">
               <a href="{% url 'news:post' post.id %}">{% if post.comment_set.count > 0 %}{{ post.comment_set.count }} comment{% if post.comment_set.count > 1 %}s{% endif %}{% else %}write comment{% endif %}</a>
            </div>
            <!-- Some comments -->
            <div class="comments">
              {% for comment in post.top_comments %}
                <span>{{ comment.body }} - {{ comment.author.username }}</span><br/>
              {% endfor %}
            </div>
          </div>

        </div>


       <!-- Quote -->
      {% elif post.style == 1 %}

<div class="post">
  <div class="grid-x">
      <div class="cell large-2">
        <img src="{% static 'media/' %}{{ post.image_url }}" width="150" height="150"/>
      </div>
      <div class="cell large-8">
        <h1><a href="{{ post.url }}">{{ post.title }}</a></h1>
        <p class="contentbody">{{ post.body }}</p>
    </div>

  </div>

  <div class="info">
    <a href="{% url 'news:post' post.id %}">{% if post.comment_set.count > 0 %}{{ post.comment_set.count }} comments{% else %}write comment{% endif %}</a>
  </div>
  <!-- Some comments -->
  <div class="comments">
    {% for comment in post.top_comments %}
      <span>{{ comment.body }} - {{ comment.author.username }}</span><br/>
    {% endfor %}
  </div>


</div>

      <!-- Picture no title no link -->
      {% elif post.style == 2 %}

        <div class="imgcontainer">
          <img class="crop" src="{% static 'media/' %}{{ post.image_url }}"/>
        </div>

        <div class="info">
           <a href="{% url 'news:post' post.id %}">{% if post.comment_set.count > 0 %}{{ post.comment_set.count }} comments{% else %}write comment{% endif %}</a>
        </div>
        <!-- Some comments -->
        <div class="comments">
          {% for comment in post.top_comments %}
            <span>{{ comment.body }} - {{ comment.author.username }}</span><br/>
          {% endfor %}
        </div>


      {% endif %}
    </article>

<!-- </div> -->
    {% endfor %}

    <!-- Pagination -->
    <!-- <ul class="pagination" role="navigation" aria-label="Pagination">
      <li class="disabled">Previous <span class="show-for-sr">page</span></li>
      <li class="current"><span class="show-for-sr">You're on page</span> 1</li>
      <li><a href="#0" aria-label="Page 2">2</a></li>
      <li><a href="#0" aria-label="Page 3">3</a></li>
      <li><a href="#0" aria-label="Page 4">4</a></li>
      <li class="ellipsis" aria-hidden="true"></li>
      <li><a href="#0" aria-label="Page 12">12</a></li>
      <li><a href="#0" aria-label="Page 13">13</a></li>
      <li><a href="#0" aria-label="Next page">Next <span class="show-for-sr">page</span></a></li>
    </ul> -->

    <div class="pagination">
        <span class="step-links">
            {% if latest_post_list.has_previous %}
                <a href="?page=1">&laquo; first</a>
                <a href="?page={{ latest_post_list.previous_page_number }}">previous</a>
            {% endif %}

            <span class="current">
                Page {{ latest_post_list.number }} of {{ latest_post_list.paginator.num_pages }}
            </span>

            {% if latest_post_list.has_next %}
                <a href="?page={{ latest_post_list.next_page_number }}">next</a>
                <a href="?page={{ latest_post_list.paginator.num_pages }}">last &raquo;</a>
            {% endif %}
        </span>
    </div>


{% else %}
    <p>No posts are available.</p>
{% endif %}

{% endblock content %}