From 1a34a9f78641d868f7445c3f4cabbef7c563b78c Mon Sep 17 00:00:00 2001
From: Matthew Lemon <y@yulqen.org>
Date: Mon, 21 Oct 2024 17:28:41 +0100
Subject: wip: remove bootstrap part 1

---
 .../templates/resources/resource_detail.html       | 46 ++++++++---------
 .../templates/resources/resource_list.html         | 58 +++++++++++-----------
 2 files changed, 52 insertions(+), 52 deletions(-)

(limited to 'alphabetlearning/templates/resources')

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 %}
-- 
cgit v1.2.3