1 files changed, 110 insertions, 0 deletions
diff --git a/alphabetlearning/templates/resources/resource_list.html b/alphabetlearning/templates/resources/resource_list.html
new file mode 100644
index 0000000..fdd0394
--- /dev/null
+++ b/alphabetlearning/templates/resources/resource_list.html
@@ -0,0 +1,110 @@
+{% extends "base.html" %}
+{% load static %}
+{% load markdown_extras %}
+{% block title %}
+    Alphabet Learning - Resource List
+{% endblock title %}
+{% block content %}
+
+    <div class="row my-4">
+        {% include "resources/admin_bar.html" %}
+    </div>
+
+    {# featured resources #}
+    {% if featured_resources %}
+        <div class="row my-4 text-center">
+            <h5 class="display-6">Featured resources</h5>
+        </div>
+
+        <div class="row">
+        {% for featured_resource in featured_resources %}
+            {% if featured_resources|length == 1 %}
+                <div class="col-lg-12 col-md-12 col-sm-12 mb-4 resource-card">
+            {% elif featured_resources|length == 2 %}
+                <div class="col-lg-6 col-md-6 col-sm-12 mb-4 resource-card">
+            {% elif featured_resources|length == 3 %}
+                <div class="col-lg-4 col-md-6 col-sm-12 mb-4 resource-card">
+            {% endif %}
+        {% include "resources/resource_card_featured.html" with resource=featured_resource %}
+        </div>
+        {% endfor %}
+    </div>
+    {% else %}
+        <p>There are no featured resources</p>
+    {% endif %}
+
+    {# standard resources #}
+    <div class="row my-4 text-center">
+        <div class="col">
+            <h5 class="display-6 text-display-secondary">Standard resources</h5>
+        </div>
+    </div>
+
+    <!-- Tabbed navigation bar for filtering -->
+    <ul class="nav nav-tabs mb-4" id="resourceTabs" role="tablist">
+        <li class="nav-item">
+            <a class="nav-link {% if selected_category == 'all' %}active{% endif %}" href="?category=all">All</a>
+        </li>
+        {% for category in categories %}
+            <li class="nav-item">
+                <a class="nav-link {% if selected_category == category.name %}active{% endif %}"
+                   href="?category={{ category.name }}">{{ category.name|title }}</a>
+            </li>
+        {% endfor %}
+    </ul>
+
+
+    <div class="row">
+        {% for resource in page_obj.object_list %}
+            <div class="col-md-6 mb-4" data-type="{{ resource.main_resource_category_name }}">
+                {% include "resources/resource_card_standard.html" with resource=resource %}
+            </div>
+        {% endfor %}
+    </div>
+
+    {# Pagination #}
+    {% if page_obj.has_other_pages %}
+        <div class="row my-4">
+            <div class="col">
+                <nav aria-label="Page navigation">
+                    <ul class="pagination justify-content-center">
+                        {% if page_obj.has_previous %}
+                            <li class="page-item">
+                                <a class="page-link" href="?page=
+                                        {{ page_obj.previous_page_number }}{% if selected_category != 'all' %}&category={{ selected_category }}{% endif %}">Previous</a>
+                            </li>
+                        {% else %}
+                            <li class="page-item disabled">
+                                <span class="page-link">Previous</span>
+                            </li>
+                        {% endif %}
+
+                        {% for page_num in page_obj.paginator.page_range %}
+                            {% if page_obj.number == page_num %}
+                                <li class="page-item active">
+                                    <span class="page-link">{{ page_num }}</span>
+                                </li>
+                            {% else %}
+                                <li class="page-item">
+                                    <a class="page-link" href="?page=
+                                            {{ page_num }}{% if selected_category != 'all' %}&category={{ selected_category }}{% endif %}">{{ page_num }}</a>
+                                </li>
+                            {% endif %}
+                        {% endfor %}
+
+                        {% if page_obj.has_next %}
+                            <li class="page-item">
+                                <a class="page-link" href="?page=
+                                        {{ page_obj.next_page_number }}{% if selected_category != 'all' %}&category={{ selected_category }}{% endif %}">Next</a>
+                            </li>
+                        {% else %}
+                            <li class="page-item disabled">
+                                <span class="page-link">Next</span>
+                            </li>
+                        {% endif %}
+                    </ul>
+                </nav>
+            </div>
+        </div>
+    {% endif %}
+{% endblock content %}