[IMP] *: remove image_64 and clean views

There are too many image sizes. Since they are stored resized this takes time to
generate when saving a new image, it's more rows on the attachment table, more
files on the disk, ...

64px is close enough to 128px that it can be removed without a big impact on
download size.

It will even reduce download and number of requests when both images are
displayed because now only one has to be downloaded and then benefit from cache.

The difference between the two is typically around 1.5kB which is negligible
these days, especially when the request overhead is around 0.5kB already, not
even taking into account other factors such as latency.

If a 64px image must absolutely be returned, it is still possible to pass the
size parameters to the image route. But the current guideline is to handle
resizing in the views when necessary.

Views
=====

- remove width and height attributes when existing CSS rules are overriding them
  (eg. `.oe_kanban_avatar` in the right context)
- add CSS rules instead of width and height attributes when possible
- use `object-fit: cover;` where width and height are forced to avoid distortion
  of non-square images
- for products, use `object-fit: contain;` instead, keep ratio but without crop
- add new CSS rules where the expected size was max 64px*64px before due to the
  image size itself
- remove `img-fluid` where using size classes to avoid conflicting rules

task-2060865

closes odoo/odoo#36147

Signed-off-by: Sébastien Theys (seb) <seb@odoo.com>

1 files changed, 2 insertions, 2 deletions

diff --git a/addons/website_membership/views/website_membership_templates.xml b/addons/website_membership/views/website_membership_templates.xml
index 3ff095b3123..89cb67ec0d7 100644
--- a/addons/website_membership/views/website_membership_templates.xml
+++ b/addons/website_membership/views/website_membership_templates.xml
@@ -54,8 +54,8 @@
                                 <t t-set="partner" t-value="partners[partner_id]"/>
                                 <div class="media mt-3">
                                     <a t-attf-href="/members/#{slug(partner)}"
-                                       t-field="partner.image_64"
-                                       t-options='{"widget": "image", "class": "media-object mr-3"}'
+                                       t-field="partner.image_128"
+                                       t-options='{"widget": "image", "qweb_img_responsive": False, "class": "o_image_64_cover mr-3"}'
                                     ></a>
                                     <div class="media-body" style="min-height: 64px;">
                                         <a t-attf-href="/members/#{slug(partner)}">