🌸 Marketplace: Product::Photos don't reflow the page (#1517)

- #1326
- #1428

Depending on device bandwidth, even 150x150 `Product::Photo`s can
take a quarter to a half second to load.

When the photo does not have a set height; this results in the page
re-flowing as the photo loads in.

To Test:

- Add several `Products` with a `Product::Photo` to a `Marketplace`
- Throttle your network connection to 2g (Firefox DevTools can do this)
- Visit the `Marketplace`
  - Before: `Product`s would "bump" down the page as the photos load.
  - After: `Product`s stay in the same dang place, even as the photos load

Reference:
- https://css-tricks.com/preventing-content-reflow-from-lazy-loaded-images/
  (Note: While this talks about lazy-loaded images, the principal of
   "set the height and width of the image!" still applies)

app/furniture/marketplace/cart_product_component.html.erb

@@ -1,10 +1,10 @@
 <tr id="<%= dom_id %>">
   <td class="w-full max-w-0 py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:w-auto sm:max-w-none sm:pl-6">
     <%- if product.photo.present? %>
-      <figure>
-        <%= image_tag product.photo.variant(resize_to_limit: [150, 150]).processed.url, class: "rounded-lg"
+      <figure class="w-40 text-center relative">
+        <%= image_tag product.photo.variant(resize_to_limit: [150, 150]).processed.url, class: "mx-auto h-40 overflow-hidden object-center rounded-lg"
  %>
-        <figcaption class="text-center py-2">
+        <figcaption class="mt-2">
           <%=product.name%>
         </figcaption>
       </figure>