From f831a385239d26a2e770ea0f9e8f3a74b0993482 Mon Sep 17 00:00:00 2001
From: grandeljay <github.jay@grandel.anonaddy.me>
Date: Tue, 15 Nov 2022 16:02:44 +0100
Subject: [PATCH] Decrease wish height on mobile devices

---
 src/assets/css/default.css | 20 +++++++++++++++-----
 src/pages/changelog.php    | 10 ++++++++++
 2 files changed, 25 insertions(+), 5 deletions(-)

diff --git a/src/assets/css/default.css b/src/assets/css/default.css
index e48c0861..9a4c3317 100644
--- a/src/assets/css/default.css
+++ b/src/assets/css/default.css
@@ -105,9 +105,21 @@ figure {
 }
 
 /** Image */
+.wishlist .ui.card > .image {
+    --hoverHeight: calc(1em + 3 * var(--padding));
+}
+
+.wishlist .ui.card > .image > :is(svg, img.preview) {
+    height: var(--hoverHeight);
+}
+@media (hover: hover) {
+    .wishlist .ui.card > .image > :is(svg, img.preview) {
+        height: var(--wishPreviewHeight);
+    }
+}
+
 .wishlist .ui.card > .image > svg {
     width: 100%;
-    height: var(--wishPreviewHeight);
 
     color: #f0f0f0;
     background-color: #f4f4f4;
@@ -141,15 +153,13 @@ figure {
         }
     }
     .wishlist .ui.card:hover > .image > svg {
-        height: calc(1em + 3 * var(--padding) - 5px);
+        height: calc(var(--hoverHeight) - 5px);
         padding: 0 !important;
         opacity: 0;
     }
 }
 
 .wishlist .ui.card > .image > img.preview {
-    height: var(--wishPreviewHeight);
-
     object-fit: cover;
     object-position: 50%;
     background-color: #fff;
@@ -172,7 +182,7 @@ figure {
     }
 
     .wishlist .ui.card:hover > .image > img.preview {
-        height: calc(1em + 3 * var(--padding));
+        height: var(--hoverHeight);
     }
 }
 
diff --git a/src/pages/changelog.php b/src/pages/changelog.php
index 5de96d9d..75ae5911 100644
--- a/src/pages/changelog.php
+++ b/src/pages/changelog.php
@@ -105,6 +105,16 @@ $page->navigation();
                                 </li>
                             </ul>
 
+                            <h3 class="ui header"><?= __('Changed') ?></h3>
+                            <ul>
+                                <li>
+                                    <?php
+                                        /** TRANSLATORS: Changelog: Fixed */
+                                        echo  __('Decreased wish height on mobile devices');
+                                    ?>
+                                </li>
+                            </ul>
+
                             <h3 class="ui header"><?= __('Fixed') ?></h3>
                             <ul>
                                 <li>