Use SVG icon instead of font icon in modeladmin index view

This uses the same classes and tags than 'wagtailadmin/shared/header.html' to construct the <header> element and its children.
wagtail · Oct 1, 2021 · c4350d5 · c4350d5
1 parent d67fdd1
commit c4350d5
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 6 deletions.
diff --git a/CHANGELOG.txt b/CHANGELOG.txt
@@ -34,6 +34,7 @@ Changelog
  * Add section about CSV exports to security documentation (Matt Westcott)
  * Add initial support for Django 4.0 deprecations (Matt Westcott, Jochen Wersdörfer)
  * Move translations in `nl_NL` to `nl` (Loïc Teixeira, Coen van der Kamp)
+ * Use SVG icon instead of font icon in modeladmin index view (Jerome Lebleu)
  * Fix: Delete button is now correct colour on snippets and modeladmin listings (Brandon Murch)
  * Fix: Ensure that StreamBlock / ListBlock-level validation errors are counted towards error counts (Matt Westcott)
  * Fix: InlinePanel add button is now keyboard navigatable (Jesse Menn)

diff --git a/wagtail/contrib/modeladmin/templates/modeladmin/index.html b/wagtail/contrib/modeladmin/templates/modeladmin/index.html
@@ -15,15 +15,16 @@
 
 {% block content %}
     {% block header %}
-        <header class="nice-padding hasform">
-            <div class="row">
+        <header class="hasform">
+            <div class="row nice-padding">
                 <div class="left header-left">
                     <div class="col header-title">
                         {% block h1 %}
-                        <h1 {% if view.header_icon %}class="icon icon-{{ view.header_icon }}"{% endif %}>
-                            {{ view.get_page_title }}
-                            {% include 'modeladmin/includes/result_count.html' %}
-                        </h1>
+                            <h1>
+                                {% if view.header_icon %}{% icon name=view.header_icon class_name="header-title-icon" %}{% endif %}
+                                {{ view.get_page_title }}
+                                {% include 'modeladmin/includes/result_count.html' %}
+                            </h1>
                         {% endblock %}
                     </div>
                     {% block search %}{% search_form %}{% endblock %}