Add screen-reader-only h2 to breads and locations index pages (#569)

Co-authored-by: Thibaud Colas <thibaudcolas@gmail.com>

bakerydemo/templates/base/home_page.html

@@ -32,7 +32,7 @@
                         <ul class="featured-cards__list">
                             {% for childpage in page.featured_section_1.specific.children|slice:"3" %}
                                 <li>
-                                    {% include "includes/card/listing-card.html" with page=childpage %}
+                                    {% include "includes/card/listing-card.html" with page=childpage h2=False %}
                                 </li>
                             {% endfor %}
                         </ul>

bakerydemo/templates/breads/breads_index_page.html

@@ -8,7 +8,7 @@
         <ul class="bread-list">
             {% for bread in breads %}
                 <li>
-                    {% include "includes/card/listing-card.html" with page=bread %}
+                    {% include "includes/card/listing-card.html" with page=bread h2=True %}
                 </li>
             {% endfor %}
         </ul>

bakerydemo/templates/includes/card/listing-card.html

@@ -8,7 +8,11 @@
             </figure>
         {% endif %}
         <div class="listing-card__contents">
-            <h3 class="listing-card__title">{{ page.title }}</h3>
+            {% if h2 %}
+                <h2 class="listing-card__title">{{ page.title }}</h2>
+            {% else %}
+                <h3 class="listing-card__title">{{ page.title }}</h3>
+            {% endif %}
             {% if page.origin or page.bread_type %}
                 <table class="listing-card__meta">
                     {% if page.origin %}

bakerydemo/templates/includes/card/picture-card.html

@@ -9,7 +9,11 @@
                 {% picture page.image format-{avif,webp,jpeg} fill-{300x200-c75,645x480-c75} sizes="(max-width: 768px)150px,30vw" loading="lazy" %}
             {% endif %}
             <div class="picture-card__contents">
-                <h3 class="picture-card__title">{{ page.title }}</h3>
+                {% if portrait %}
+                    <h3 class="picture-card__title">{{ page.title }}</h3>
+                {% else %}
+                    <h2 class="picture-card__title">{{ page.title }}</h2>
+                {% endif %}
             </div>
         </figure>
     </a>

bakerydemo/templates/locations/locations_index_page.html

@@ -13,4 +13,3 @@
         </div>
     </div>
 {% endblock content %}
-