index.html 2.55 KB
Newer Older
David Haynes's avatar
David Haynes committed
1
<!-- include the base html template -->
2
{% extends 'layouts/base.html' %}
David Haynes's avatar
David Haynes committed
3 4

<!-- define the page title block -->
5
{% block title %}
Zach Knox's avatar
Zach Knox committed
6
SRCT Go &bull; My Links
7 8
{% endblock %}

David Haynes's avatar
David Haynes committed
9
<!-- define the content block for the page -->
10 11
{% block content %}

David Haynes's avatar
David Haynes committed
12
<!-- define the page header div -->
13 14 15
<div class="page-header" id="banner">
  <div class="row">
    <div class="col-md-12">
16
      <h1>
David Haynes's avatar
David Haynes committed
17 18 19 20
        <span class="fa-stack fa-lg">
          <i class="fa fa-circle fa-stack-2x"></i>
          <i class="fa fa-link fa-stack-1x fa-inverse"></i>
        </span>
21 22
        My Links
      </h1>
23 24
    </div>
  </div>
Zach Knox's avatar
Zach Knox committed
25
  <div class="newlink" style="text-align: right;">
26
      <a href="{% url 'new_link' %}"><i class="fa fa-plus" aria-hidden="true"></i> Add new link</a>
Zach Knox's avatar
Zach Knox committed
27
  </div>
28 29
</div>

30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57
<!-- display sort menu if there are any links -->
{% if urls %}
    <div class="dropdown" style="text-align:right;">
        <!-- button for the dropdown menu -->
        <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">
            Sort By <i class="fa fa-caret-down fa-fw"></i>
        </button>
        <!-- generate the list of sorting options based on given sort_methods -->
        <ul class="dropdown-menu dropdown-menu-right" style="margin-top: 2px;">
            {% for method, name in sort_methods.items %}
                <!-- check if currently selected sort method is this one to highlight -->
                {% if request.GET.sort == method %}
                    <li style="background: #eee;" {# class="active" Properly implmenet the .active class#}>
                <!-- if there is no currently selected sort method, highlight the default case "Most Recent" -->
                {% elif request.GET.sort == null and method == "-date_created" %}
                    <li style="background: #eee;" {# class="active" Properly implmenet the .active class#}>
                <!-- no styling -->
                {% else %}
                    <li>
                {% endif %}
                    <!-- create link to sort method -->
                    <a href="?sort={{ method }}" style="color: #262626;">{{ name }}</a>
                </li>
            {% endfor %}
        </ul>
    </div>
{% endif %}

Zach Knox's avatar
Zach Knox committed
58 59 60 61 62 63 64 65 66 67 68 69 70
<!-- show all of the links -->
<div class="row">
    <!-- for every url in the urls list-->
    {% for url in urls %}
        <legend>
        <!-- include the link box for this url -->
        {% include 'link_box.html' %}
        </legend>
    <!-- unless the list is empty -->
    {% empty %}
      <h3>&nbsp;&nbsp;&nbsp;None found <i class="fa fa-frown-o"></i></h3>
    {% endfor %}
</div>
David Haynes's avatar
David Haynes committed
71

72
{% endblock %}