Display profile pic on lists as well

src/character/static/character/details.css

@@ -1,4 +0,0 @@
-img.profile-pic {
-    max-width: 240px;
-    max-height: 240px;
-}

src/character/templates/character/character_details.html

@@ -1,12 +1,7 @@
 {% extends "common/base.html" %}
-{% load static %}
 {% load django_bootstrap5 %}
 {% load character_extras %}
 
-{% block head_end %}
-    <link rel="stylesheet" href="{% static "character/details.css" %}">
-{% endblock %}
-
 {% block title %}{{ character.name }}{% endblock %}
 
 {% block content %}

src/character/templates/character/snippets/characters_list/character_card.html

@@ -3,6 +3,12 @@
     <div class="card character" data-id="{{ character.pk }}">
         <div class="card-body">
             <h5 class="card-title">
+                {% if character.profile_picture %}
+                    <img src="{{ character.profile_picture.url }}"
+                        class="profile-pic rounded-5"
+                        alt="Image de profil"
+                    >
+                {% endif %}
                 {% if character.private %}
                     <i class="fa-solid fa-lock"
                         data-bs-toggle="tooltip"

src/common/static/style.css

@@ -10,3 +10,15 @@ blockquote {
     padding-left: 2em;
     border-left: solid #d5d5d5 4px;
 }
+
+.card img.profile-pic {
+    width: 28px;
+    height: 28px;
+    object-fit: cover;
+}
+
+img.profile-pic {
+    max-width: 240px;
+    max-height: 240px;
+    object-fit: cover;
+}