From 1adef8fbf08da4ee3c32ebbf9912bbf33708caed Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Date: Mon, 9 Sep 2024 15:49:40 +0530
Subject: [PATCH 1/5] chore: sidebar hover effect disabled for pwa

---
 .../sidebar/favorites/favorites-menu.tsx      | 10 ++++--
 .../workspace/sidebar/projects-list-item.tsx  | 33 ++++++++---------
 .../workspace/sidebar/projects-list.tsx       | 13 +++++--
 .../workspace/sidebar/workspace-menu.tsx      | 35 ++++++++++++-------
 4 files changed, 54 insertions(+), 37 deletions(-)

diff --git a/web/core/components/workspace/sidebar/favorites/favorites-menu.tsx b/web/core/components/workspace/sidebar/favorites/favorites-menu.tsx
index f7b620f7a49..935c5e214a1 100644
--- a/web/core/components/workspace/sidebar/favorites/favorites-menu.tsx
+++ b/web/core/components/workspace/sidebar/favorites/favorites-menu.tsx
@@ -124,16 +124,22 @@ export const SidebarFavoritesMenu = observer(() => {
             ref={elementRef}
             as="button"
             className={cn(
-              "sticky top-0 bg-custom-sidebar-background-100 z-10 group/workspace-button w-full px-2 py-1.5 flex items-center justify-between gap-1 text-custom-sidebar-text-400 hover:bg-custom-sidebar-background-90 rounded text-xs font-semibold",
+              "sticky top-0 bg-custom-sidebar-background-100 z-10 w-full px-2 py-1.5 flex items-center justify-between gap-1 text-custom-sidebar-text-400 rounded text-xs font-semibold",
               {
                 "bg-custom-sidebar-background-80 opacity-60": isDragging,
+                "group/workspace-button hover:bg-custom-sidebar-background-90": !isMobile,
               }
             )}
           >
             <span onClick={() => toggleFavoriteMenu(!isFavoriteMenuOpen)} className="flex-1 text-start">
               YOUR FAVORITES
             </span>
-            <span className="flex flex-shrink-0 opacity-0 pointer-events-none group-hover/workspace-button:opacity-100 group-hover/workspace-button:pointer-events-auto rounded p-0.5 ">
+            <span
+              className={cn("flex flex-shrink-0 rounded p-0.5", {
+                "opacity-0 pointer-events-none group-hover/workspace-button:opacity-100 group-hover/workspace-button:pointer-events-auto":
+                  !isMobile,
+              })}
+            >
               <Tooltip tooltipHeading="Create folder" tooltipContent="">
                 <FolderPlus
                   onClick={() => {
diff --git a/web/core/components/workspace/sidebar/projects-list-item.tsx b/web/core/components/workspace/sidebar/projects-list-item.tsx
index c232baa8b4e..977feab96a6 100644
--- a/web/core/components/workspace/sidebar/projects-list-item.tsx
+++ b/web/core/components/workspace/sidebar/projects-list-item.tsx
@@ -301,13 +301,11 @@ export const SidebarProjectsListItem: React.FC<Props> = observer((props) => {
         >
           <DropIndicator classNames="absolute top-0" isVisible={instruction === "DRAG_OVER"} />
           <div
-            className={cn(
-              "group/project-item relative w-full px-2 py-1.5 flex items-center rounded-md text-custom-sidebar-text-100 hover:bg-custom-sidebar-background-90",
-              {
-                "bg-custom-sidebar-background-90": isMenuActive,
-                "p-0 size-8 aspect-square justify-center mx-auto": isSidebarCollapsed,
-              }
-            )}
+            className={cn("relative w-full px-2 py-1.5 flex items-center rounded-md text-custom-sidebar-text-100", {
+              "bg-custom-sidebar-background-90": isMenuActive,
+              "p-0 size-8 aspect-square justify-center mx-auto": isSidebarCollapsed,
+              "group/project-item hover:bg-custom-sidebar-background-90": !isMobile,
+            })}
             id={`${project?.id}`}
           >
             {!disableDrag && (
@@ -385,12 +383,11 @@ export const SidebarProjectsListItem: React.FC<Props> = observer((props) => {
                       <MoreHorizontal className="size-4" />
                     </span>
                   }
-                  className={cn(
-                    "opacity-0 pointer-events-none flex-shrink-0 group-hover/project-item:opacity-100 group-hover/project-item:pointer-events-auto",
-                    {
-                      "opacity-100 pointer-events-auto": isMenuActive,
-                    }
-                  )}
+                  className={cn("flex-shrink-0 pointer-events-auto", {
+                    "opacity-100 pointer-events-auto": isMenuActive,
+                    "opacity-0 pointer-events-none group-hover/project-item:opacity-100 group-hover/project-item:pointer-events-auto":
+                      !isMobile,
+                  })}
                   customButtonClassName="grid place-items-center"
                   placement="bottom-start"
                   useCaptureForOutsideClick
@@ -468,12 +465,10 @@ export const SidebarProjectsListItem: React.FC<Props> = observer((props) => {
                 <Disclosure.Button
                   as="button"
                   type="button"
-                  className={cn(
-                    "hidden group-hover/project-item:inline-block p-0.5 rounded hover:bg-custom-sidebar-background-80",
-                    {
-                      "inline-block": isMenuActive,
-                    }
-                  )}
+                  className={cn("inline-block p-0.5 rounded", {
+                    "inline-block": isMenuActive,
+                    "hidden group-hover/project-item:inline-block hover:bg-custom-sidebar-background-80": !isMobile,
+                  })}
                   onClick={() => setIsProjectListOpen(!isProjectListOpen)}
                 >
                   <ChevronRight
diff --git a/web/core/components/workspace/sidebar/projects-list.tsx b/web/core/components/workspace/sidebar/projects-list.tsx
index c9943a54205..f19b9dff42f 100644
--- a/web/core/components/workspace/sidebar/projects-list.tsx
+++ b/web/core/components/workspace/sidebar/projects-list.tsx
@@ -22,6 +22,7 @@ import { orderJoinedProjects } from "@/helpers/project.helper";
 import { copyUrlToClipboard } from "@/helpers/string.helper";
 // hooks
 import { useAppTheme, useCommandPalette, useEventTracker, useProject, useUser } from "@/hooks/store";
+import { usePlatformOS } from "@/hooks/use-platform-os";
 
 export const SidebarProjectsList: FC = observer(() => {
   // get local storage data for isFavoriteProjectsListOpen and isAllProjectsListOpen
@@ -40,6 +41,7 @@ export const SidebarProjectsList: FC = observer(() => {
   const {
     membership: { currentWorkspaceRole },
   } = useUser();
+  const { isMobile } = usePlatformOS();
   const { getProjectById, joinedProjectIds: joinedProjects, updateProjectView } = useProject();
   // router params
   const { workspaceSlug } = useParams();
@@ -155,10 +157,11 @@ export const SidebarProjectsList: FC = observer(() => {
           <Disclosure as="div" className="flex flex-col" defaultOpen={isAllProjectsListOpen}>
             <div
               className={cn(
-                "group w-full flex items-center justify-between px-2 py-1.5 rounded text-custom-sidebar-text-400 hover:bg-custom-sidebar-background-90",
+                "w-full flex items-center justify-between px-2 py-1.5 rounded text-custom-sidebar-text-400",
                 {
                   "p-0 justify-center w-fit mx-auto bg-custom-sidebar-background-90 hover:bg-custom-sidebar-background-80":
                     isCollapsed,
+                  "group hover:bg-custom-sidebar-background-90": !isMobile,
                 }
               )}
             >
@@ -166,7 +169,7 @@ export const SidebarProjectsList: FC = observer(() => {
                 as="button"
                 type="button"
                 className={cn(
-                  "group w-full flex items-center gap-1 whitespace-nowrap text-left text-sm font-semibold text-custom-sidebar-text-400",
+                  "w-full flex items-center gap-1 whitespace-nowrap text-left text-sm font-semibold text-custom-sidebar-text-400",
                   {
                     "!text-center w-8 px-2 py-1.5 justify-center": isCollapsed,
                   }
@@ -184,7 +187,11 @@ export const SidebarProjectsList: FC = observer(() => {
                 </Tooltip>
               </Disclosure.Button>
               {!isCollapsed && (
-                <div className="flex items-center opacity-0 pointer-events-none group-hover:opacity-100 group-hover:pointer-events-auto">
+                <div
+                  className={cn("flex items-center pointer-events-auto", {
+                    "opacity-0 pointer-events-none group-hover:opacity-100 group-hover:pointer-events-auto": !isMobile,
+                  })}
+                >
                   {isAuthorizedUser && (
                     <Tooltip tooltipHeading="Create project" tooltipContent="">
                       <button
diff --git a/web/core/components/workspace/sidebar/workspace-menu.tsx b/web/core/components/workspace/sidebar/workspace-menu.tsx
index 3b230b1b78a..0eda8d32b9d 100644
--- a/web/core/components/workspace/sidebar/workspace-menu.tsx
+++ b/web/core/components/workspace/sidebar/workspace-menu.tsx
@@ -70,11 +70,12 @@ export const SidebarWorkspaceMenu = observer(() => {
   return (
     <Disclosure as="div" defaultOpen>
       {!sidebarCollapsed && (
-        <div className={
-          cn("flex px-2 bg-custom-sidebar-background-100 group/workspace-button hover:bg-custom-sidebar-background-90 rounded", {
+        <div
+          className={cn("flex px-2 bg-custom-sidebar-background-100 rounded", {
             "mt-2.5": !sidebarCollapsed,
-          })
-        }>
+            "group/workspace-button hover:bg-custom-sidebar-background-90": !isMobile,
+          })}
+        >
           {" "}
           <Disclosure.Button
             as="button"
@@ -95,12 +96,11 @@ export const SidebarWorkspaceMenu = observer(() => {
                 <MoreHorizontal className="size-4" />
               </span>
             }
-            className={cn(
-              "h-full flex items-center opacity-0 z-20 pointer-events-none flex-shrink-0 group-hover/workspace-button:opacity-100 group-hover/workspace-button:pointer-events-auto my-auto",
-              {
-                "opacity-100 pointer-events-auto": isMenuActive,
-              }
-            )}
+            className={cn("h-full flex items-center z-20 flex-shrink-0  my-auto pointer-events-auto", {
+              "opacity-100 pointer-events-auto": isMenuActive,
+              "opacity-0 pointer-events-none group-hover/workspace-button:opacity-100 group-hover/workspace-button:pointer-events-auto":
+                !isMobile,
+            })}
             customButtonClassName="grid place-items-center"
             placement="bottom-start"
           >
@@ -124,11 +124,20 @@ export const SidebarWorkspaceMenu = observer(() => {
           </CustomMenu>
           <Disclosure.Button
             as="button"
-            className="sticky top-0 z-10 group/workspace-button px-0.5 py-1.5 flex items-center justify-between gap-1 text-custom-sidebar-text-400 hover:bg-custom-sidebar-background-90 rounded text-xs font-semibold"
+            className={cn(
+              "sticky top-0 z-10 px-0.5 py-1.5 flex items-center justify-between gap-1 text-custom-sidebar-text-400 rounded text-xs font-semibold",
+              {
+                "group/workspace-button hover:bg-custom-sidebar-background-90": !isMobile,
+              }
+            )}
             onClick={() => toggleWorkspaceMenu(!isWorkspaceMenuOpen)}
           >
-            {" "}
-            <span className="flex-shrink-0 opacity-0 pointer-events-none group-hover/workspace-button:opacity-100 group-hover/workspace-button:pointer-events-auto rounded hover:bg-custom-sidebar-background-80">
+            <span
+              className={cn("flex-shrink-0 pointer-events-auto rounded", {
+                "opacity-0 pointer-events-none group-hover/workspace-button:opacity-100 group-hover/workspace-button:pointer-events-auto hover:bg-custom-sidebar-background-80":
+                  !isMobile,
+              })}
+            >
               <ChevronRight
                 className={cn("size-4 flex-shrink-0 text-custom-sidebar-text-400 transition-transform", {
                   "rotate-90": isWorkspaceMenuOpen,

From 4f07b1996e6cec9dbad48599913eb3ff0ab5309e Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Date: Mon, 9 Sep 2024 15:50:10 +0530
Subject: [PATCH 2/5] chore: existing and parent issue modal hover effect
 disabled for pwa

---
 .../core/modals/existing-issues-list-modal.tsx        |  9 ++++++---
 .../components/issues/parent-issues-list-modal.tsx    | 11 +++++++----
 2 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/web/core/components/core/modals/existing-issues-list-modal.tsx b/web/core/components/core/modals/existing-issues-list-modal.tsx
index 238efb7a900..583829e6fa2 100644
--- a/web/core/components/core/modals/existing-issues-list-modal.tsx
+++ b/web/core/components/core/modals/existing-issues-list-modal.tsx
@@ -8,6 +8,7 @@ import { ISearchIssueResponse, TProjectIssuesSearchParams } from "@plane/types";
 // ui
 import { Button, Loader, ToggleSwitch, Tooltip, TOAST_TYPE, setToast } from "@plane/ui";
 // helpers
+import { cn } from "@/helpers/common.helper";
 import { getTabIndex } from "@/helpers/tab-indices.helper";
 // hooks
 import useDebounce from "@/hooks/use-debounce";
@@ -244,9 +245,9 @@ export const ExistingIssuesListModal: React.FC<Props> = (props) => {
                                   htmlFor={`issue-${issue.id}`}
                                   value={issue}
                                   className={({ active }) =>
-                                    `group flex w-full cursor-pointer select-none items-center justify-between gap-2 rounded-md px-3 py-2 my-0.5 text-custom-text-200 ${
+                                    `flex w-full cursor-pointer select-none items-center justify-between gap-2 rounded-md px-3 py-2 my-0.5 text-custom-text-200 ${
                                       active ? "bg-custom-background-80 text-custom-text-100" : ""
-                                    } ${selected ? "text-custom-text-100" : ""}`
+                                    } ${selected ? "text-custom-text-100" : ""} ${!isMobile ? "group" : ""}`
                                   }
                                 >
                                   <div className="flex items-center gap-2">
@@ -271,7 +272,9 @@ export const ExistingIssuesListModal: React.FC<Props> = (props) => {
                                   <a
                                     href={`/${workspaceSlug}/projects/${issue.project_id}/issues/${issue.id}`}
                                     target="_blank"
-                                    className="z-1 relative hidden text-custom-text-200 hover:text-custom-text-100 group-hover:block"
+                                    className={cn("z-1 relative block text-custom-text-200", {
+                                      "hidden group-hover:block hover:text-custom-text-100": !isMobile,
+                                    })}
                                     rel="noopener noreferrer"
                                     onClick={(e) => e.stopPropagation()}
                                   >
diff --git a/web/core/components/issues/parent-issues-list-modal.tsx b/web/core/components/issues/parent-issues-list-modal.tsx
index fab6bbaf179..8a53f291cc7 100644
--- a/web/core/components/issues/parent-issues-list-modal.tsx
+++ b/web/core/components/issues/parent-issues-list-modal.tsx
@@ -13,6 +13,7 @@ import { Loader, ToggleSwitch, Tooltip } from "@plane/ui";
 // components
 import { IssueSearchModalEmptyState } from "@/components/core";
 // helpers
+import { cn } from "@/helpers/common.helper";
 import { getTabIndex } from "@/helpers/tab-indices.helper";
 // hooks
 import useDebounce from "@/hooks/use-debounce";
@@ -96,7 +97,7 @@ export const ParentIssuesListModal: React.FC<Props> = ({
             <div className="fixed inset-0 bg-custom-backdrop transition-opacity" />
           </Transition.Child>
 
-          <div className="fixed inset-0 z-20 overflow-y-auto p-4 sm:p-6 md:p-20">
+          <div className="fixed inset-0 z-10 overflow-y-auto p-4 sm:p-6 md:p-20">
             <Transition.Child
               as={React.Fragment}
               enter="ease-out duration-300"
@@ -189,9 +190,9 @@ export const ParentIssuesListModal: React.FC<Props> = ({
                                 key={issue.id}
                                 value={issue}
                                 className={({ active, selected }) =>
-                                  `group flex w-full cursor-pointer select-none items-center justify-between gap-2 rounded-md px-3 py-2 my-0.5 text-custom-text-200 ${
+                                  `flex w-full cursor-pointer select-none items-center justify-between gap-2 rounded-md px-3 py-2 my-0.5 text-custom-text-200 ${
                                     active ? "bg-custom-background-80 text-custom-text-100" : ""
-                                  } ${selected ? "text-custom-text-100" : ""}`
+                                  } ${selected ? "text-custom-text-100" : ""} ${!isMobile ? "group" : ""}`
                                 }
                               >
                                 <div className="flex flex-grow items-center gap-2 truncate">
@@ -215,7 +216,9 @@ export const ParentIssuesListModal: React.FC<Props> = ({
                                 <a
                                   href={`/${workspaceSlug}/projects/${issue.project_id}/issues/${issue.id}`}
                                   target="_blank"
-                                  className="z-1 relative hidden flex-shrink-0 text-custom-text-200 hover:text-custom-text-100 group-hover:block"
+                                  className={cn("z-1 relative block flex-shrink-0 text-custom-text-200 ", {
+                                    "hidden hover:text-custom-text-100 group-hover:block": !isMobile,
+                                  })}
                                   rel="noopener noreferrer"
                                   onClick={(e) => e.stopPropagation()}
                                 >

From 8e4f18a7f441348ad7ecec66518de7237abc2eef Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Date: Mon, 9 Sep 2024 15:50:31 +0530
Subject: [PATCH 3/5] fix: calendar mobile layout

---
 .../issue-layouts/calendar/calendar.tsx       | 24 -------------------
 1 file changed, 24 deletions(-)

diff --git a/web/core/components/issues/issue-layouts/calendar/calendar.tsx b/web/core/components/issues/issue-layouts/calendar/calendar.tsx
index 1a17edbd09b..914c73f1259 100644
--- a/web/core/components/issues/issue-layouts/calendar/calendar.tsx
+++ b/web/core/components/issues/issue-layouts/calendar/calendar.tsx
@@ -219,30 +219,6 @@ export const CalendarChart: React.FC<Props> = observer((props) => {
             </div>
           </div>
         </IssueLayoutHOC>
-
-        {/* mobile view */}
-        <div className="md:hidden">
-          <p className="p-4 text-xl font-semibold">
-            {`${selectedDate.getDate()} ${
-              MONTHS_LIST[selectedDate.getMonth() + 1].title
-            }, ${selectedDate.getFullYear()}`}
-          </p>
-          <CalendarIssueBlocks
-            date={selectedDate}
-            issueIdList={issueIdList}
-            quickActions={quickActions}
-            loadMoreIssues={loadMoreIssues}
-            getPaginationData={getPaginationData}
-            getGroupIssueCount={getGroupIssueCount}
-            enableQuickIssueCreate
-            disableIssueCreation={!enableIssueCreation || !isEditingAllowed}
-            quickAddCallback={quickAddCallback}
-            addIssuesToView={addIssuesToView}
-            readOnly={readOnly}
-            isDragDisabled
-            isMobileView
-          />
-        </div>
       </div>
     </>
   );

From 305ddd1dd8d2eb47bccc39b15b740510d5f9ec45 Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Date: Mon, 9 Sep 2024 15:51:24 +0530
Subject: [PATCH 4/5] chore: code refactor

---
 .../components/issues/issue-detail/root.tsx   | 28 +++++++++++--------
 1 file changed, 16 insertions(+), 12 deletions(-)

diff --git a/web/core/components/issues/issue-detail/root.tsx b/web/core/components/issues/issue-detail/root.tsx
index e520da2acbf..9d1252c028d 100644
--- a/web/core/components/issues/issue-detail/root.tsx
+++ b/web/core/components/issues/issue-detail/root.tsx
@@ -17,6 +17,7 @@ import { EUserProjectRoles } from "@/constants/project";
 // hooks
 import { useAppTheme, useEventTracker, useIssueDetail, useIssues, useUser } from "@/hooks/store";
 import { useAppRouter } from "@/hooks/use-app-router";
+import { usePlatformOS } from "@/hooks/use-platform-os";
 // images
 import emptyIssue from "@/public/empty-state/issue.svg";
 // local components
@@ -81,6 +82,7 @@ export const IssueDetailRoot: FC<TIssueDetailRoot> = observer((props) => {
     membership: { currentProjectRole },
   } = useUser();
   const { issueDetailSidebarCollapsed } = useAppTheme();
+  const { isMobile } = usePlatformOS();
 
   const issueOperations: TIssueOperations = useMemo(
     () => ({
@@ -359,18 +361,20 @@ export const IssueDetailRoot: FC<TIssueDetailRoot> = observer((props) => {
               isArchived={is_archived}
             />
           </div>
-          <div
-            className="fixed right-0 z-[5] h-full w-full min-w-[300px] overflow-hidden border-l border-custom-border-200 bg-custom-sidebar-background-100 pb-5 sm:w-1/2 md:relative md:w-1/3 lg:min-w-80 xl:min-w-96"
-            style={issueDetailSidebarCollapsed ? { right: `-${window?.innerWidth || 0}px` } : {}}
-          >
-            <IssueDetailsSidebar
-              workspaceSlug={workspaceSlug}
-              projectId={projectId}
-              issueId={issueId}
-              issueOperations={issueOperations}
-              isEditable={!is_archived && isEditable}
-            />
-          </div>
+          {!isMobile && (
+            <div
+              className="fixed right-0 z-[5] h-full w-full min-w-[300px] overflow-hidden border-l border-custom-border-200 bg-custom-sidebar-background-100 pb-5 sm:w-1/2 md:relative md:w-1/3 lg:min-w-80 xl:min-w-96"
+              style={issueDetailSidebarCollapsed ? { right: `-${window?.innerWidth || 0}px` } : {}}
+            >
+              <IssueDetailsSidebar
+                workspaceSlug={workspaceSlug}
+                projectId={projectId}
+                issueId={issueId}
+                issueOperations={issueOperations}
+                isEditable={!is_archived && isEditable}
+              />
+            </div>
+          )}
         </div>
       )}
 

From e06dd81f1b960e1ac33fd25e4d35530b5e51531d Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Date: Mon, 9 Sep 2024 15:52:16 +0530
Subject: [PATCH 5/5] chore: list and kanban layout hover effect disabled for
 pwa

---
 .../issues/issue-layouts/calendar/issue-block.tsx  |  5 +++--
 .../components/issues/issue-layouts/list/block.tsx | 14 +++++++-------
 2 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/web/core/components/issues/issue-layouts/calendar/issue-block.tsx b/web/core/components/issues/issue-layouts/calendar/issue-block.tsx
index f4bbd4ac4dc..5a9f7e32cd4 100644
--- a/web/core/components/issues/issue-layouts/calendar/issue-block.tsx
+++ b/web/core/components/issues/issue-layouts/calendar/issue-block.tsx
@@ -72,7 +72,7 @@ export const CalendarIssueBlock = observer(
         href={`/${workspaceSlug?.toString()}/projects/${projectId?.toString()}/issues/${issue.id}`}
         onClick={() => handleIssuePeekOverview(issue)}
         className="block w-full text-sm text-custom-text-100 rounded border-b md:border-[1px] border-custom-border-200 hover:border-custom-border-400"
-        disabled={!!issue?.tempId || isMobile}
+        disabled={!!issue?.tempId}
         ref={ref}
       >
         <>
@@ -83,11 +83,12 @@ export const CalendarIssueBlock = observer(
           <div
             ref={blockRef}
             className={cn(
-              "group/calendar-block flex h-10 md:h-8 w-full items-center justify-between gap-1.5 rounded  md:px-1 px-4 py-1.5 ",
+              "flex h-10 md:h-8 w-full items-center justify-between gap-1.5 rounded  md:px-1 px-4 py-1.5 ",
               {
                 "bg-custom-background-90 shadow-custom-shadow-rg border-custom-primary-100": isDragging,
                 "bg-custom-background-100 hover:bg-custom-background-90": !isDragging,
                 "border border-custom-primary-70 hover:border-custom-primary-70": getIsIssuePeeked(issue.id),
+                "group/calendar-block": !isMobile,
               }
             )}
           >
diff --git a/web/core/components/issues/issue-layouts/list/block.tsx b/web/core/components/issues/issue-layouts/list/block.tsx
index a6233a36ea8..4407c68b582 100644
--- a/web/core/components/issues/issue-layouts/list/block.tsx
+++ b/web/core/components/issues/issue-layouts/list/block.tsx
@@ -132,7 +132,7 @@ export const IssueBlock = observer((props: IssueBlockProps) => {
     <Row
       ref={issueRef}
       className={cn(
-        "group/list-block min-h-11 relative flex flex-col gap-3 bg-custom-background-100 hover:bg-custom-background-90 py-3 text-sm transition-colors border border-transparent",
+        "min-h-11 relative flex flex-col gap-3 bg-custom-background-100 py-3 text-sm transition-colors border border-transparent",
         {
           "border-custom-primary-70": getIsIssuePeeked(issue.id) && peekIssue?.nestingLevel === nestingLevel,
           "border-custom-border-400": isIssueActive,
@@ -141,6 +141,7 @@ export const IssueBlock = observer((props: IssueBlockProps) => {
           "bg-custom-background-80": isCurrentBlockDragging,
           "md:flex-row md:items-center": isSidebarCollapsed,
           "lg:flex-row lg:items-center": !isSidebarCollapsed,
+          "group/list-block hover:bg-custom-background-90": !isMobile,
         }
       )}
       onDragStart={() => {
@@ -170,12 +171,11 @@ export const IssueBlock = observer((props: IssueBlockProps) => {
               >
                 <div className="flex-shrink-0 grid place-items-center w-3.5 absolute left-1">
                   <MultipleSelectEntityAction
-                    className={cn(
-                      "opacity-0 pointer-events-none group-hover/list-block:opacity-100 group-hover/list-block:pointer-events-auto transition-opacity",
-                      {
-                        "opacity-100 pointer-events-auto": isIssueSelected,
-                      }
-                    )}
+                    className={cn("pointer-events-auto transition-opacity", {
+                      "opacity-100 pointer-events-auto": isIssueSelected,
+                      "opacity-0 pointer-events-none group-hover/list-block:opacity-100 group-hover/list-block:pointer-events-auto":
+                        !isMobile,
+                    })}
                     groupId={groupId}
                     id={issue.id}
                     selectionHelpers={selectionHelpers}