From ec8a442d3ec034437c70a112bfa91f708ee83c72 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?marcin=20miko=C5=82ajczak?= <git@mkljczk.pl>
Date: Wed, 11 Sep 2024 18:01:14 +0200
Subject: [PATCH] pl-fe: fix read more styles for quoted posts/posts with polls
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
---
 packages/pl-fe/src/components/quoted-status.tsx  |  2 +-
 packages/pl-fe/src/components/status-content.tsx | 13 +++++++------
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/packages/pl-fe/src/components/quoted-status.tsx b/packages/pl-fe/src/components/quoted-status.tsx
index 4c0ec79f32..6576fc8668 100644
--- a/packages/pl-fe/src/components/quoted-status.tsx
+++ b/packages/pl-fe/src/components/quoted-status.tsx
@@ -76,7 +76,7 @@ const QuotedStatus: React.FC<IQuotedStatus> = ({ status, onCancel, compose }) =>
     <OutlineBox
       data-testid='quoted-status'
       className={clsx('cursor-pointer', {
-        'hover:bg-gray-100 dark:hover:bg-gray-800': !compose,
+        'group hover:bg-gray-100 dark:hover:bg-gray-800': !compose,
       })}
     >
       <Stack
diff --git a/packages/pl-fe/src/components/status-content.tsx b/packages/pl-fe/src/components/status-content.tsx
index 8c26f60621..9b4506c204 100644
--- a/packages/pl-fe/src/components/status-content.tsx
+++ b/packages/pl-fe/src/components/status-content.tsx
@@ -26,14 +26,16 @@ const BIG_EMOJI_LIMIT = 10;
 interface IReadMoreButton {
   onClick: React.MouseEventHandler;
   quote?: boolean;
+  poll?: boolean;
 }
 
 /** Button to expand a truncated status (due to too much content) */
-const ReadMoreButton: React.FC<IReadMoreButton> = ({ onClick, quote }) => (
+const ReadMoreButton: React.FC<IReadMoreButton> = ({ onClick, quote, poll }) => (
   <div className='relative -mt-4'>
     <div
       className={clsx('absolute -top-16 h-16 w-full bg-gradient-to-b from-transparent to-white black:to-black dark:to-primary-900', {
-        'hover:to-gray-100 black:hover-to-gray-800 dark:hover:to-gray-800': quote,
+        'group-hover:to-gray-100 black:group-hover:to-gray-800 dark:group-hover:to-gray-800': quote,
+        'to-gray-100 dark:to-primary-800': poll,
       })}
     />
     <button className='flex items-center border-0 bg-transparent p-0 pt-2 text-gray-900 hover:underline active:underline dark:text-gray-300' onClick={onClick}>
@@ -236,14 +238,13 @@ const StatusContent: React.FC<IStatusContent> = React.memo(({
       </Markup>,
     );
 
+    const hasPoll = !!status.poll_id;
+
     if (collapsed) {
-      output.push(<ReadMoreButton onClick={onClick} key='read-more' quote={quote} />);
+      output.push(<ReadMoreButton onClick={onClick} key='read-more' quote={quote} poll={hasPoll} />);
     }
 
-    let hasPoll = false;
-
     if (status.poll_id) {
-      hasPoll = true;
       output.push(<Poll id={status.poll_id} key='poll' status={status} />);
     }