Fix wish details image size

src/assets/css/wish.css

@@ -14,16 +14,13 @@
 }
 
 /** Image */
-.ui.modal.wish-details .wish-image,
-.ui.modal.wish-details .wish-image is:(img, svg) {
-    height: auto;
-
-    max-width: 100%;
+.ui.modal.wish-details .wish-image {
+    width: 100%;
     max-height: 40vh;
 }
 @media (min-width: 768px) {
     .ui.modal.wish-details .wish-image {
-        max-width: 40%;
+        width: 40%;
         max-height: 100%;
     }
 }
@@ -33,14 +30,9 @@
     }
 }
 
-.ui.modal.wish-details .wish-image:has(.ui.placeholder) {
-    height: 40vh;
-    width: 100%;
-}
-@media (min-width: 768px) {
-    .ui.modal.wish-details .wish-image:has(.ui.placeholder) {
-        width: 40%;
-    }
+.ui.modal.wish-details .wish-image :is(img, svg) {
+    max-height: inherit;
+    margin: auto;
 }
 
 /** Placeholder */
@@ -49,8 +41,11 @@
 }
 
 /** Description */
-.ui.modal.wish-details .wish-image:has(.ui.placeholder) + .description {
+.ui.modal.wish-details .description.description {
     width: 100%;
+}
+
+.ui.modal.wish-details .wish-image + .description {
     padding-left: 2em;
 }
 

src/assets/js/parts/wish.js

@@ -33,10 +33,10 @@ $(function () {
         wish_details
         .modal({
             'onVisible' : function() {
-                /** Dirty hack to change the default display: block to flex. */
+                /** Dirty hack to change the default display: block to display: flex. */
                 setTimeout(() => {
                     $(this).css('display', '');
-                }, 1000);
+                }, 0);
             },
             'onHide' : function(modal) {
                 wish_unset();