[FIX] website_forum: force image size in css to handle gifs

Issue

	- Preferences > Change your avatar with a big .gif
	- Install Forum
	- Go on a question

	The gif is not resized in the nav and in the post
	answer box

Cause

	In fact, all gifs are not really resized. They just
	look fine because there is CSS to handle the case
	where the server resize does not work.

Solution

	Do as it is done everywhere else, add CSS rules

OPW-2223260

closes odoo/odoo#48792

X-original-commit: 35137cea
Signed-off-by: Jason Van Malder (jvm) <jvm@odoo.com>

addons/website_forum/static/src/scss/website_forum.scss

@@ -28,6 +28,10 @@ $bronze: #eea91e;
             background-color: rgba(theme-color('info'), 0.1);
             color: darken(theme-color('info'), 15%)!important;
         }
+
+        img.o_forum_avatar {
+            @include size(30px);
+        }
     }
 
     // Single Post
@@ -48,6 +52,12 @@ $bronze: #eea91e;
             border-left: .25em solid gray('500');
             color: gray('600');
         }
+
+        #post_reply {
+            img.o_forum_avatar {
+                @include size(24px);
+            }
+        }
     }
 
     .o_wforum_readable {
@@ -206,6 +216,12 @@ img.o_forum_avatar_big {
     object-fit: cover;
 }
 
+.o_wprofile_email_validation_container {
+    img.o_forum_avatar {
+        @include size(16px);
+    }
+}
+
 .o_wforum_bio_popover_wrap {
     .o_wforum_bio_popover_name {
         address > div, span[data-oe-model="res.country"] {

addons/website_forum/views/website_forum.xml

@@ -494,7 +494,7 @@
             data-toggle="tooltip"
             data-trigger="hover"
             title="My profile">
-            <img class="rounded-circle mr-1" t-att-src="website.image_url(user, 'image_128', '30x30')" alt="Avatar"/>
+            <img class="o_forum_avatar rounded-circle mr-1" t-att-src="website.image_url(user, 'image_128', '30x30')" alt="Avatar"/>
             <div>
                 <h6 class="my-0" t-esc="user_id.name"/>
                 <small class="text-muted font-weight-bold"><t t-esc="user_id.karma"/>xp</small>
@@ -578,7 +578,7 @@
                     </span>
                     <span t-if="my" t-attf-class="w-100 w-md-auto mb-2 mb-md-0 border rounded pl-2 d-inline-flex align-items-center justify-content-between #{search and 'ml-md-2'}">
                         <div>
-                            <img t-if="uid" class="rounded-circle mr-1" t-att-src="website.image_url(user, 'image_128', '16x16')" alt="Avatar"/>
+                            <img t-if="uid" class="o_forum_avatar rounded-circle mr-1" t-att-src="website.image_url(user, 'image_128', '16x16')" alt="Avatar"/>
                             <span t-if="my == 'favourites'"> My <b>Favourites</b></span>
                             <span t-elif="my == 'followed'"> I'm <b>Following</b></span>
                             <span t-elif="my == 'mine'"> My <b>Questions</b></span>
@@ -926,7 +926,7 @@
 <!-- Edition: post an answer -->
 <template id="post_answer">
     <div class="d-flex align-items-center mt-5 mb-2">
-        <img t-if="uid" t-attf-class="rounded-circle mr-2" t-att-src="website.image_url(user, 'image_128', '24x24')" alt="Avatar"/>
+        <img t-if="uid" t-attf-class="o_forum_avatar rounded-circle mr-2" t-att-src="website.image_url(user, 'image_128', '24x24')" alt="Avatar"/>
         <h4 class="my-0">Your Answer</h4>
     </div>
     <t t-if="request.params.get('nocontent')">