From 32d32b72f4f90cbee8121656b5561400e339fc51 Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Sat, 30 Dec 2023 20:29:21 +0800
Subject: [PATCH] Less radius for animated media

---
 src/components/media.jsx  |  2 +-
 src/components/status.css | 11 +++++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/components/media.jsx b/src/components/media.jsx
index d6011a0..2ce3f78 100644
--- a/src/components/media.jsx
+++ b/src/components/media.jsx
@@ -358,7 +358,7 @@ function Media({
         <Parent
           class={`media ${className} media-${isGIF ? 'gif' : 'video'} ${
             autoGIFAnimate ? 'media-contain' : ''
-          }`}
+          } ${hoverAnimate ? 'media-hover-animate' : ''}`}
           data-orientation={orientation}
           data-formatted-duration={
             !showOriginal ? formattedDuration : undefined
diff --git a/src/components/status.css b/src/components/status.css
index aadd0f4..e4a7886 100644
--- a/src/components/status.css
+++ b/src/components/status.css
@@ -940,6 +940,10 @@
 }
 .status.large .media-container.media-eq1 {
   max-height: min(var(--height), 60vh);
+
+  .media-gif.media-contain {
+    border-radius: 2px;
+  }
 }
 .status.large
   .media-container:not(.status-card .media-container).media-eq1
@@ -1159,6 +1163,13 @@ body:has(#modal-container .carousel) .status .media img:hover {
 .status .media-contain video {
   object-fit: scale-down !important;
 }
+.status .media-eq1 .media-hover-animate {
+  transition: border-radius 0.15s ease-out;
+
+  &:hover {
+    border-radius: 2px;
+  }
+}
 /* .status .media-audio {
   border: 0;
   min-height: 0;