diff options
author | Matthew Lemon <y@yulqen.org> | 2024-10-21 17:28:41 +0100 |
---|---|---|
committer | Matthew Lemon <y@yulqen.org> | 2024-10-21 17:28:41 +0100 |
commit | 1a34a9f78641d868f7445c3f4cabbef7c563b78c (patch) | |
tree | b1752369a52571afa45c311bad746b21df4c06ce /alphabetlearning/templates | |
parent | 9f09904d56e70c8cf8b0a6b39385dd72b11ec2cb (diff) |
wip: remove bootstrap part 1
Diffstat (limited to 'alphabetlearning/templates')
-rw-r--r-- | alphabetlearning/templates/base.html | 374 | ||||
-rw-r--r-- | alphabetlearning/templates/resources/resource_detail.html | 46 | ||||
-rw-r--r-- | alphabetlearning/templates/resources/resource_list.html | 58 |
3 files changed, 215 insertions, 263 deletions
diff --git a/alphabetlearning/templates/base.html b/alphabetlearning/templates/base.html index 8bc9416..4b21f74 100644 --- a/alphabetlearning/templates/base.html +++ b/alphabetlearning/templates/base.html @@ -3,229 +3,181 @@ <!DOCTYPE html> {% get_current_language as LANGUAGE_CODE %} <html lang="{{ LANGUAGE_CODE }}"> -<head> - <meta charset="utf-8"/> - <meta http-equiv="x-ua-compatible" content="ie=edge"/> - <title> - {% block title %} - Alphabet Learning - {% endblock title %} - </title> - <meta name="viewport" content="width=device-width, initial-scale=1.0"/> - <meta name="description" content="Joanna Lemon Resources"/> - <meta name="author" content="Matthew Lemon"/> - <link rel="icon" href="{% static 'images/favicons/al.png' %}"/> - {% block extra_css %} - {% endblock extra_css %} - {% block css %} - <!--Latest compiled and minified Bootstrap CSS --> - {# <link rel="stylesheet"#} - {# href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.2.3/css/bootstrap.min.css"#} - {# integrity="sha512-SbiR/eusphKoMVVXysTKG/7VseWii+Y3FdHrt0EpKgpToZeemhqHeZeLWLhJutz/2ut2Vw1uQEj2MbRF+TVBUA=="#} - {# crossorigin="anonymous"#} - {# referrerpolicy="no-referrer" />#} - <!-- Your stuff: Third-party CSS libraries go here --> - <!-- This file stores project-specific CSS --> - <link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.css' %}"/> - <link rel="stylesheet" href="{% static 'css/custom.css' %}"/> + <head> + <meta charset="utf-8"/> + <meta http-equiv="x-ua-compatible" content="ie=edge"/> + <title> + {% block title %} + Alphabet Learning + {% endblock title %} + </title> + <meta name="viewport" content="width=device-width, initial-scale=1.0"/> + <meta name="description" content="Joanna Lemon Resources"/> + <meta name="author" content="Matthew Lemon"/> + <link rel="icon" href="{% static 'images/favicons/al.png' %}"/> + {% block extra_css %} + {% endblock extra_css %} + {% block css %} <link rel="stylesheet" href="{% static 'css/project.css' %}"/> - <link rel="stylesheet" href="{% static 'css/features.css' %}"> - {# <link rel="stylesheet" href="{% static "css/wrapper.css" %}" type="text/css" media="screen" charset="utf-8" />#} - {% endblock css %} - <!-- Le javascript - ================================================== --> - {# Placed at the top of the document so pages load faster with defer #} - {% block javascript %} - <!-- Bootstrap JS --> - {# <script defer#} - {# src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.2.3/js/bootstrap.min.js"#} - {# integrity="sha512-1/RvZTcCDEUjY/CypiMz+iqqtaoQfAITmNSJY17Myp4Ms5mdxPS5UV7iOfdZoxcGhzFbOm6sntTKJppjvuhg4g=="#} - {# crossorigin="anonymous"#} - {# referrerpolicy="no-referrer"></script>#} - <!-- Your stuff: Third-party javascript libraries go here --> - <!-- place project specific Javascript in this file --> + {% endblock css %} + {% block javascript %} <script defer src="{% static 'js/project.js' %}"></script> - <script src="{% static "bootstrap/js/bootstrap.js" %}"></script> <script src="{% static "js/htmx.min.js" %}"></script> <script src="https://js.stripe.com/v3/"></script> - {% endblock javascript %} -</head> -<body> + {% endblock javascript %} + </head> + <body> -<header> - <nav class="navbar navbar-expand-lg navbar-light bg-white"> - <div class="container-fluid"> - <a class="navbar-brand" href="{% url "home" %}"> - <img src="{% static "images/AL_long_logo_black_grey.png" %}" width=300px alt="Alphabet Learning Logo"> - </a> - <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" - aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> - <span class="navbar-toggler-icon"></span> - </button> - - - <div class="collapse navbar-collapse" id="navbarNav"> - - <ul class="navbar-nav ms-auto"> - <li class="nav-item"> - <!-- <div class="d-flex align-items-end mx-1 p-1 px-3 text-white rounded rounded-sm bg-primary"> --> - <!-- <div> --> - <!-- <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-2" width="32" height="32"> --> - <!-- <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 3h1.386c.51 0 .955.343 1.087.835l.383 1.437M7.5 14.25a3 3 0 0 0-3 3h15.75m-12.75-3h11.218c1.121-2.3 2.1-4.684 2.924-7.138a60.114 60.114 0 0 0-16.536-1.84M7.5 14.25 5.106 5.272M6 20.25a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Zm12.75 0a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Z" /> --> - <!-- </svg> --> - <!-- </div> --> - <!-- <div class="fw-bold"> --> - <!-- Cart --> - <!-- </div> --> - <!-- </div> --> - </li> - <li class="nav-item"> - {% if request.user.is_authenticated %} - <a class="nav-link text-gray fw-bold" href="{% url "users:detail" request.user.id %}">{{ request.user }}</a> - {% else %} - <a class="nav-link text-dark fw-bold" href="{% url "account_login" %}">Log in</a> - {% endif %} - </li> - - <li class="nav-item"> - <a class="nav-link text-dark fw-bold" href="{% url "resources:resource_list" %}">Resources</a> - </li> - <li class="nav-item"> - <a class="nav-link text-dark fw-bold" - href="https://www.tes.com/teaching-resources/shop/joannalemon" - target="_blank">TES Shop</a> - </li> - <li class="nav-item"> - <a class="nav-link text-dark fw-bold" href="https://joannalemon.etsy.com/" - target="_blank">Etsy</a> - </li> - <li class="nav-item"> - <a class="nav-link text-dark fw-bold" href="https://blog.joannalemon.com" - target="_blank">Blog</a> - </li> - <li> - {% if request.user.is_authenticated %} - <a class="nav-link text-gray fw-bold" href="{% url "account_logout" %}">Log out</a> - {% endif %} - </li> - <li class="nav-item"> - - {% if request.user.shoppingcart %} - - <!- TODO - fix this, the logic should be different button if no cart -> - <! this is a problem because it seems you can have an empty cart -> - <div class="mx-2 gray-icon"> - <a href="{% url "payments:cart_detail" %}" class="full-basket-button"> - <span class="fw-bold px-1"> - Items in cart ( - {{ request.user.shoppingcart.items.count }} - ) - </span> - <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-bag" viewBox="0 0 16 16"> - <path d="M8 1a2.5 2.5 0 0 1 2.5 2.5V4h-5v-.5A2.5 2.5 0 0 1 8 1m3.5 3v-.5a3.5 3.5 0 1 0-7 0V4H1v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V4zM2 5h12v9a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1z"/> - </svg> - </a> - </div> - - {% else %} + <header> + <nav> + <a href="{% url "home" %}"> + <img src="{% static "images/AL_long_logo_black_grey.png" %}" width=300px alt="Alphabet Learning Logo"> + </a> + <div> + <ul> + <li> + {% if request.user.is_authenticated %} + <a href="{% url "users:detail" request.user.id %}">{{ request.user }}</a> + {% else %} + <a href="{% url "account_login" %}">Log in</a> + {% endif %} + </li> - <div class="mx-2 gray-icon"> - <button class="empty-basket-button" disabled><span class="fw-bold px-1">Empty Basket</span> - <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-bag-x" viewBox="0 0 16 16"> - <path fill-rule="evenodd" d="M6.146 8.146a.5.5 0 0 1 .708 0L8 9.293l1.146-1.147a.5.5 0 1 1 .708.708L8.707 10l1.147 1.146a.5.5 0 0 1-.708.708L8 10.707l-1.146 1.147a.5.5 0 0 1-.708-.708L7.293 10 6.146 8.854a.5.5 0 0 1 0-.708"/> - <path d="M8 1a2.5 2.5 0 0 1 2.5 2.5V4h-5v-.5A2.5 2.5 0 0 1 8 1m3.5 3v-.5a3.5 3.5 0 1 0-7 0V4H1v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V4zM2 5h12v9a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1z"/> - </svg> - </button> - </div> - {% endif %} - </li> - </ul> - </div> - </div> - </nav> - <div class="border-bottom border-dark border-1"></div> -</header> -<main> - {% block body %} - {% if messages %} - {% for message in messages %} - <div class="alert alert-dismissible {% if message.tags %}alert-{{ message.tags }}{% endif %}"> - {{ message }} - <button type="button" - class="btn-close" - data-bs-dismiss="alert" - aria-label="Close"></button> - </div> - {% endfor %} - {% endif %} - {% block main %} - <div class="container"> - {% block content %} - {% endblock content %} - <footer class="pt-4 my-md-5 pt-md-5 border-top"> - <div class="row"> - <div class="col-12 col-md"> - <img class="mb-2" src="#" alt="" width="24" height="19"> - <small class="d-block mb-3 text-muted">© 2024</small> - </div> - <div class="col-6 col-md"> - <h5>Features</h5> - <ul class="list-unstyled text-small"> - <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Cool stuff</a> + <li> + <a href="{% url "resources:resource_list" %}">Resources</a> </li> - <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Random - feature</a></li> - <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Team - feature</a></li> - <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Stuff for - developers</a></li> - <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Another one</a> + <li> + <a href="https://www.tes.com/teaching-resources/shop/joannalemon" + target="_blank">TES Shop</a> </li> - <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Last time</a> + <li> + <a href="https://joannalemon.etsy.com/" target="_blank">Etsy</a> </li> - </ul> - </div> - <div class="col-6 col-md"> - <h5>Pages on this site</h5> - <ul class="list-unstyled text-small"> - <li class="mb-1"><a class="link-secondary text-decoration-none" - href="{% url "resources:resource_list" %}">Resources</a></li> - <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Resource - name</a></li> - <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Another - resource</a></li> - <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Final - resource</a></li> - </ul> - </div> - <div class="col-6 col-md"> - <h5>About</h5> - <ul class="list-unstyled text-small"> - <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Team</a></li> - <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Locations</a> + <li> + <a href="https://blog.joannalemon.com" target="_blank">Blog</a> </li> - <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Privacy</a> + <li> + {% if request.user.is_authenticated %} + <a href="{% url "account_logout" %}">Log out</a> + {% endif %} + </li> + <li> + + {% if request.user.shoppingcart %} + + <!- TODO - fix this, the logic should be different button if no cart -> + <! this is a problem because it seems you can have an empty cart -> + <div> + <a href="{% url "payments:cart_detail" %}" class="full-basket-button"> + <span> + Items in cart ( + {{ request.user.shoppingcart.items.count }} + ) + </span> + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-bag" viewBox="0 0 16 16"> + <path d="M8 1a2.5 2.5 0 0 1 2.5 2.5V4h-5v-.5A2.5 2.5 0 0 1 8 1m3.5 3v-.5a3.5 3.5 0 1 0-7 0V4H1v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V4zM2 5h12v9a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1z"/> + </svg> + </a> + </div> + + {% else %} + + <div> + <button disabled><span class="fw-bold px-1">Empty Basket</span> + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-bag-x" viewBox="0 0 16 16"> + <path fill-rule="evenodd" d="M6.146 8.146a.5.5 0 0 1 .708 0L8 9.293l1.146-1.147a.5.5 0 1 1 .708.708L8.707 10l1.147 1.146a.5.5 0 0 1-.708.708L8 10.707l-1.146 1.147a.5.5 0 0 1-.708-.708L7.293 10 6.146 8.854a.5.5 0 0 1 0-.708"/> + <path d="M8 1a2.5 2.5 0 0 1 2.5 2.5V4h-5v-.5A2.5 2.5 0 0 1 8 1m3.5 3v-.5a3.5 3.5 0 1 0-7 0V4H1v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V4zM2 5h12v9a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1z"/> + </svg> + </button> + </div> + {% endif %} </li> - <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Terms</a></li> </ul> </div> + </nav> + <div></div> + </header> + <main> + {% block body %} + {% if messages %} + {% for message in messages %} + <div class="alert alert-dismissible {% if message.tags %}alert-{{ message.tags }}{% endif %}"> + {{ message }} + <button type="button" + class="btn-close" + data-bs-dismiss="alert" + aria-label="Close"></button> </div> - </footer> + {% endfor %} + {% endif %} + {% block main %} + <div class="main"> + {% block content %} + {% endblock content %} + <footer> + <div> + <div> + <img src="#" alt="" width="24" height="19"> + <small>© 2024</small> + </div> + <div> + <h5>Features</h5> + <ul> + <li><a class="link-secondary text-decoration-none" href="#">Cool stuff</a> + </li> + <li><a class="link-secondary text-decoration-none" href="#">Random + feature</a></li> + <li><a class="link-secondary text-decoration-none" href="#">Team + feature</a></li> + <li><a class="link-secondary text-decoration-none" href="#">Stuff for + developers</a></li> + <li><a class="link-secondary text-decoration-none" href="#">Another one</a> + </li> + <li><a class="link-secondary text-decoration-none" href="#">Last time</a> + </li> + </ul> + </div> + <div> + <h5>Pages on this site</h5> + <ul> + <li><a class="link-secondary text-decoration-none" + href="{% url "resources:resource_list" %}">Resources</a></li> + <li><a class="link-secondary text-decoration-none" href="#">Resource + name</a></li> + <li><a class="link-secondary text-decoration-none" href="#">Another + resource</a></li> + <li><a class="link-secondary text-decoration-none" href="#">Final + resource</a></li> + </ul> + </div> + <div> + <h5>About</h5> + <ul> + <li><a class="link-secondary text-decoration-none" href="#">Team</a></li> + <li><a class="link-secondary text-decoration-none" href="#">Locations</a> + </li> + <li><a class="link-secondary text-decoration-none" href="#">Privacy</a> + </li> + <li><a class="link-secondary text-decoration-none" href="#">Terms</a></li> + </ul> + </div> + </div> + </footer> - </div> - {% endblock main %} - {% endblock body %} -</main> -<!-- /container --> -{% block modal %} -{% endblock modal %} -{% block inline_javascript %} -{% comment %} -Script tags with only code, no src (defer by default). To run -with a "defer" so that you run inline code: -<script> - # + </div> + {% endblock main %} + {% endblock body %} + </main> + <!-- /container --> + {% block modal %} + {% endblock modal %} + {% block inline_javascript %} + {% comment %} + Script tags with only code, no src (defer by default). To run + with a "defer" so that you run inline code: + <script> + # } { # window.addEventListener('DOMContentLoaded', () => { # @@ -236,8 +188,8 @@ with a "defer" so that you run inline code: }); # } -</script> -{% endcomment %} -{% endblock inline_javascript %} -</body> + </script> + {% endcomment %} + {% endblock inline_javascript %} + </body> </html> diff --git a/alphabetlearning/templates/resources/resource_detail.html b/alphabetlearning/templates/resources/resource_detail.html index 334f4ed..5012c5b 100644 --- a/alphabetlearning/templates/resources/resource_detail.html +++ b/alphabetlearning/templates/resources/resource_detail.html @@ -4,21 +4,21 @@ {% block content %} -<div class="row my-4"> - <div class="col-md-7"> +<div> + <div> {% for tn_url, tn_filename in resource.thumbnails %} <div> - <img class="img-fluid rounded mx-1" src="{{ tn_url }}" alt="{{ tn_filename }}"/> + <img src="{{ tn_url }}" alt="{{ tn_filename }}"/> </div> {% endfor %} </div> - <div class="col-md-5"> - <div class="row"> - <div class="col"> - <p class="my-1 fw-bold fs-3">{{ resource.name }}</p> + <div> + <div> + <div> + <p>{{ resource.name }}</p> </div> </div> - <div class="d-flex justify-content-between align-items-center"> + <div> <div> <p class="boo-magenta my-1 fw-semibold fs-5">{{ resource.main_resource_category }}</p> </div> @@ -27,36 +27,36 @@ </div> </div> - <div class="col"> + <div> {% if resource.pdf_filenames|length > 1 %} - <p class="text-secondary my-1">Contains {{ resource.pdf_filenames|length }} PDF files.</p> + <p>Contains {{ resource.pdf_filenames|length }} PDF files.</p> {% else %} - <p class="text-secondary my-1">Contains {{ resource.pdf_filenames|length }} PDF file.</p> + <p>Contains {{ resource.pdf_filenames|length }} PDF file.</p> {% endif %} </div> - <div class="col"> - <p class="fs-3 fw-semibold">£{{ resource.price|floatformat:2 }} (or 1 credit)</p> + <div> + <p>£{{ resource.price|floatformat:2 }} (or 1 credit)</p> </div> <hr> - <div class="row"> - <div class="col"> - <p class="my-1 fw-semibold fs-5">Product summary</p> + <div> + <div> + <p>Product summary</p> <p>{{resource.card_description}}</p> </div> </div> - <div class="row align-items-end"> - <div class="my-4 d-flex"> + <div> + <div> {% if resource.in_cart %} <form action="{% url 'payments:add_to_basket' resource.id %}" method="get" accept-charset="utf-8"> - <button class="btn btn-primary" disabled> + <button> In basket </button> </form> {% else %} <form action="{% url 'payments:add_to_basket' resource.id %}" method="get" accept-charset="utf-8"> - <button class="btn btn-primary"> + <button> Add to basket </button> </form> @@ -69,7 +69,7 @@ <!-- Here be the carousel stuff --> <!-- except we are doing away with the carousel in this design --> -<div class="d-flex justify-content-start"> +<div class="flex justify-content-start"> {% for snapshot_filename, snapshot_urls in resource.snapshot_urls.items %} {% for snapshot_url in snapshot_urls %} <div> @@ -80,8 +80,8 @@ </div> <!-- detailed description row --> -<div class="row py-4"> - <div class="col-12"> +<div> + <div> <h4>Product detail</h4> {{ resource.description | markdown | safe }} </div> diff --git a/alphabetlearning/templates/resources/resource_list.html b/alphabetlearning/templates/resources/resource_list.html index fdd0394..9ea9177 100644 --- a/alphabetlearning/templates/resources/resource_list.html +++ b/alphabetlearning/templates/resources/resource_list.html @@ -6,24 +6,24 @@ {% endblock title %} {% block content %} - <div class="row my-4"> + <div> {% 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> + <h1>Featured resources</h1> </div> - <div class="row"> + <div> {% 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"> + <div> {% elif featured_resources|length == 2 %} - <div class="col-lg-6 col-md-6 col-sm-12 mb-4 resource-card"> + <div> {% elif featured_resources|length == 3 %} - <div class="col-lg-4 col-md-6 col-sm-12 mb-4 resource-card"> + <div> {% endif %} {% include "resources/resource_card_featured.html" with resource=featured_resource %} </div> @@ -34,19 +34,19 @@ {% 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> + <h1>Standard resources</h1> </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> + <ul id="resourceTabs" role="tablist"> + <li> + <a {% if selected_category == 'all' %}active{% endif %}" href="?category=all">All</a> </li> {% for category in categories %} - <li class="nav-item"> + <li> <a class="nav-link {% if selected_category == category.name %}active{% endif %}" href="?category={{ category.name }}">{{ category.name|title }}</a> </li> @@ -54,9 +54,9 @@ </ul> - <div class="row"> + <div> {% for resource in page_obj.object_list %} - <div class="col-md-6 mb-4" data-type="{{ resource.main_resource_category_name }}"> + <div data-type="{{ resource.main_resource_category_name }}"> {% include "resources/resource_card_standard.html" with resource=resource %} </div> {% endfor %} @@ -64,41 +64,41 @@ {# Pagination #} {% if page_obj.has_other_pages %} - <div class="row my-4"> - <div class="col"> + <div> + <div> <nav aria-label="Page navigation"> - <ul class="pagination justify-content-center"> + <ul> {% if page_obj.has_previous %} - <li class="page-item"> - <a class="page-link" href="?page= + <li> + <a 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> + <span>Previous</span> </li> {% endif %} {% for page_num in page_obj.paginator.page_range %} {% if page_obj.number == page_num %} - <li class="page-item active"> + <li> <span class="page-link">{{ page_num }}</span> </li> {% else %} - <li class="page-item"> - <a class="page-link" href="?page= + <li> + <a 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= + <li> + <a href="?page= {{ page_obj.next_page_number }}{% if selected_category != 'all' %}&category={{ selected_category }}{% endif %}">Next</a> </li> {% else %} - <li class="page-item disabled"> + <li> <span class="page-link">Next</span> </li> {% endif %} |