💥(templates) add branding_topbar_logo

Add a new block to host the site image and move the previous one to the outer block. This will allow us to override the `branding_topbar` and the outer link behaviour for a11y purposes.
openfun · Dec 16, 2024 · 3686981 · 3686981
1 parent 0e67e48
commit 3686981
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 2 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -18,6 +18,10 @@ Versioning](https://semver.org/spec/v2.0.0.html).
 
 - Fix frontend translation of Enroll now for external LMS backend
 
+### Changed
+
+- Change `branding_topbar` to have and additonal layer in `branding_topbar_logo`
+
 ## [2.33.0] - 2024-12-02
 
 ### Added

diff --git a/UPGRADE.md b/UPGRADE.md
@@ -51,6 +51,11 @@ $ make migrate
   Other page levels won't be allowed to create a PageIndex extension. Commonly it would
   be `0` for when your main menu list the root pages.
 
+- After the change to the `base.html` template, you will now need to add the
+  `branding_topbar_logo` layer to the `branding_topbar` layer to have the same funcionality.
+  If this remais the same in any site on your site factory, the `Go to homepage` link won't be
+  available.
+
 ## 2.31.0 to 2.33.0
 
 - Add new `slider` plugin theme scheme:

diff --git a/src/richie/apps/core/templates/richie/base.html b/src/richie/apps/core/templates/richie/base.html
@@ -98,11 +98,13 @@
                     <div class="topbar__container">
                         <header class="topbar__header">
                             <div class="topbar__brand">
-                                <a href="/" title="{% trans "Go to homepage" %}" rel="home" accesskey="h">
                                 {% block branding_topbar %}
+                                <a href="/" title="{% trans "Go to homepage" %}" rel="home" accesskey="h">
+                                    {% block branding_topbar_logo %}
                                     <img src="{% static "richie/images/logo.png" %}" class="topbar__logo" alt="{{ SITE.name }}">
-                                {% endblock branding_topbar %}
+                                    {% endblock branding_topbar_logo %}
                                 </a>
+                                {% endblock branding_topbar %}
 
                                 <button
                                     class="topbar__hamburger"