From 71e2c5d8dfacb2e5f1164cb27f38fc3d46933569 Mon Sep 17 00:00:00 2001
From: Maksim Eltyshev <meltyshev@gmail.com>
Date: Sat, 24 May 2025 13:01:07 +0200
Subject: [PATCH] fix: Apply disabled style to card content instead of wrapper

---
 client/src/components/cards/Card/Card.jsx     | 22 ++++++++++++-------
 .../components/cards/Card/Card.module.scss    | 10 ++++-----
 2 files changed, 19 insertions(+), 13 deletions(-)

diff --git a/client/src/components/cards/Card/Card.jsx b/client/src/components/cards/Card/Card.jsx
index dc78ef09..00dced39 100755
--- a/client/src/components/cards/Card/Card.jsx
+++ b/client/src/components/cards/Card/Card.jsx
@@ -101,18 +101,19 @@ const Card = React.memo(({ id, isInline }) => {
 
   return (
     <div
-      className={classNames(
-        styles.wrapper,
-        list.type === ListTypes.CLOSED && styles.wrapperDisabled,
-        isHighlightedAsRecent && styles.wrapperRecent,
-        'card',
-      )}
+      className={classNames(styles.wrapper, isHighlightedAsRecent && styles.wrapperRecent, 'card')}
     >
       {card.isPersisted ? (
         <>
           {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events,
                                        jsx-a11y/no-static-element-interactions */}
-          <div className={styles.content} onClick={handleClick}>
+          <div
+            className={classNames(
+              styles.content,
+              list.type === ListTypes.CLOSED && styles.contentDisabled,
+            )}
+            onClick={handleClick}
+          >
             <Content cardId={id} />
             {colorLineNode}
           </div>
@@ -125,7 +126,12 @@ const Card = React.memo(({ id, isInline }) => {
           )}
         </>
       ) : (
-        <span className={styles.content}>
+        <span
+          className={classNames(
+            styles.content,
+            list.type === ListTypes.CLOSED && styles.contentDisabled,
+          )}
+        >
           <Content cardId={id} />
           {colorLineNode}
         </span>
diff --git a/client/src/components/cards/Card/Card.module.scss b/client/src/components/cards/Card/Card.module.scss
index 4e0c4681..4d71b897 100644
--- a/client/src/components/cards/Card/Card.module.scss
+++ b/client/src/components/cards/Card/Card.module.scss
@@ -43,6 +43,11 @@
     }
   }
 
+  .contentDisabled {
+    filter: saturate(0.5);
+    opacity: 0.64;
+  }
+
   .wrapper {
     background: #fff;
     border-radius: 3px;
@@ -59,11 +64,6 @@
     }
   }
 
-  .wrapperDisabled {
-    filter: saturate(0.5);
-    opacity: 0.64;
-  }
-
   .wrapperRecent:not(:hover) {
     overflow: hidden;