From: Chris Fulljames <christianfulljames@gmail.com>
Date: Sun, 23 Feb 2025 17:10:51 +0000 (-0500)
Subject: Set default size for profile images to prevent layout shift
X-Git-Url: https://littlesong.place/gitweb/gitweb.cgi?a=commitdiff_plain;h=1b696623cccaed56ef9e83105f8c5b8596d39785;p=littlesongplace.git

Set default size for profile images to prevent layout shift
---

diff --git a/templates/index.html b/templates/index.html
index 987f922..5b4df3a 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -24,7 +24,7 @@ better, I'm open to any thoughts or feedback you have!  Just send me
     <div class="user-list-entry-container">
         <a href="/users/{{ user['username'] }}" class="user-list-entry" style="--yellow:{{ user['bgcolor'] }};--black:{{ user['fgcolor'] }};--purple:{{ user['accolor'] }};">
             {% if user['has_pfp'] -%}
-            <img class="small-pfp" src="/pfp/{{ user['userid'] }}" />
+            <img class="small-pfp" src="/pfp/{{ user['userid'] }}" width="32" height="32" />
             {%- endif %}
             <span>{{ user['username'] }}</span>
         </a>
diff --git a/templates/song-list.html b/templates/song-list.html
index 0b5ac2e..775125c 100644
--- a/templates/song-list.html
+++ b/templates/song-list.html
@@ -7,7 +7,7 @@
             <div class="song-list-pfp-container">
                 {%- if song.user_has_pfp %}
                 <!-- Profile Picture -->
-                <img class="small-pfp" src="/pfp/{{ song.userid }}" onerror="this.style.display = 'none'" />
+                <img class="small-pfp" src="/pfp/{{ song.userid }}" onerror="this.style.display = 'none'" width="32" height="32" />
                 {%- endif %}
             </div>