fix: can not keep text selection, fixed #1895

Signed-off-by: Innei <tukon479@gmail.com>

Author: Innei

apps/renderer/src/components/ui/markdown/components/Toc.tsx

@@ -163,11 +163,13 @@ const TocHoverCard: React.FC<TocHoverCardProps> = ({
                             handleScrollTo(index, heading.$heading, heading.anchorId)
                           }}
                         >
-                          <span className="duration-200 group-hover:text-accent/80">
+                          <span className="select-none duration-200 group-hover:text-accent/80">
                             {heading.title}
                           </span>
 
-                          <span className="ml-4 text-[8px] opacity-50">H{heading.depth}</span>
+                          <span className="ml-4 select-none text-[8px] opacity-50">
+                            H{heading.depth}
+                          </span>
                         </button>
                       </li>
                     ))}

apps/renderer/src/modules/entry-content/components/EntryTitle.tsx

@@ -104,7 +104,7 @@ export const EntryTitle = ({ entryId, compact }: EntryLinkProps) => {
       <div className="mt-2 text-[13px] font-medium text-zinc-500">
         {getPreferredTitle(feed || inbox, entry.entries)}
       </div>
-      <div className="flex items-center gap-2 text-[13px] text-zinc-500">
+      <div className="flex select-none items-center gap-2 text-[13px] text-zinc-500">
         {entry.entries.publishedAt && new Date(entry.entries.publishedAt).toLocaleString()}
 
         <div className="flex items-center gap-1">

apps/renderer/src/modules/entry-content/index.desktop.tsx

@@ -3,7 +3,7 @@ import { ScrollArea } from "@follow/components/ui/scroll-area/index.js"
 import { useTitle } from "@follow/hooks"
 import type { FeedModel, InboxModel, SupportedLanguages } from "@follow/models/types"
 import { IN_ELECTRON } from "@follow/shared/constants"
-import { clearSelection, stopPropagation } from "@follow/utils/dom"
+import { stopPropagation } from "@follow/utils/dom"
 import { cn } from "@follow/utils/utils"
 import { ErrorBoundary } from "@sentry/react"
 import { useEffect, useMemo, useRef } from "react"
@@ -166,9 +166,8 @@ export const EntryContent: Component<EntryContentProps> = ({
           ref={scrollerRef}
         >
           <div
-            onPointerDown={clearSelection}
             style={stableRenderStyle}
-            className="duration-200 ease-in-out animate-in fade-in slide-in-from-bottom-24 f-motion-reduce:fade-in-0 f-motion-reduce:slide-in-from-bottom-0"
+            className="select-text duration-200 ease-in-out animate-in fade-in slide-in-from-bottom-24 f-motion-reduce:fade-in-0 f-motion-reduce:slide-in-from-bottom-0"
             key={entry.entries.id}
           >
             <article
@@ -179,7 +178,7 @@ export const EntryContent: Component<EntryContentProps> = ({
               <EntryTitle entryId={entryId} compact={compact} />
 
               <WrappedElementProvider boundingDetection>
-                <div className="mx-auto mb-32 mt-8 max-w-full cursor-auto select-text text-[0.94rem]">
+                <div className="mx-auto mb-32 mt-8 max-w-full cursor-auto text-[0.94rem]">
                   <TitleMetaHandler entryId={entry.entries.id} />
                   <AISummary entryId={entry.entries.id} />
                   <ErrorBoundary fallback={RenderError}>