fix: fix error feed color in dark mode

Signed-off-by: Innei <i@innei.in>
RSSNext · Jul 22, 2024 · f8c53d9 · f8c53d9
1 parent 8eb1a84
commit f8c53d9
Show file tree

Hide file tree

Showing 4 changed files with 50 additions and 54 deletions.
diff --git a/src/renderer/src/components/ui/scroll-area/ScrollArea.tsx b/src/renderer/src/components/ui/scroll-area/ScrollArea.tsx
@@ -27,8 +27,8 @@ const Thumb = React.forwardRef<
     ref={forwardedRef}
     className={cn(
       "relative w-full flex-1 rounded-xl transition-colors duration-150",
-      "bg-gray-300 hover:bg-theme-accent/80 dark:bg-neutral-500",
-      "active:bg-theme-accent-50/50",
+      "bg-gray-300 hover:bg-neutral-400/80 dark:bg-neutral-500",
+      "active:bg-neutral-400/50",
       "before:absolute before:-left-1/2 before:-top-1/2 before:h-full before:min-h-[44]",
       "before:w-full before:min-w-[44] before:-translate-x-full before:-translate-y-full before:content-[\"\"]",
       className,
@@ -47,7 +47,7 @@ export const Scrollbar = React.forwardRef<
       {...rest}
       ref={forwardedRef}
       className={cn(
-        "z-[10000] flex w-2.5 touch-none select-none p-0.5",
+        "z-[99] flex w-2.5 touch-none select-none p-0.5",
         orientation === "horizontal" ?
           `h-2.5 w-full flex-col` :
           `w-2.5 flex-row`,

diff --git a/src/renderer/src/components/ui/tooltip.tsx b/src/renderer/src/components/ui/tooltip.tsx
@@ -16,7 +16,7 @@ const TooltipContent = React.forwardRef<
     ref={ref}
     sideOffset={sideOffset}
     className={cn(
-      "z-50 overflow-hidden border border-border bg-theme-tooltip-background px-2 py-1 text-theme-tooltip-foreground backdrop-blur-xl",
+      "z-[101] overflow-hidden border border-border bg-theme-tooltip-background px-2 py-1 text-theme-tooltip-foreground backdrop-blur-xl",
       "animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
       "rounded-lg text-xs",
       "max-w-[75ch] select-text",

diff --git a/src/renderer/src/modules/feed-column/item.tsx b/src/renderer/src/modules/feed-column/item.tsx
@@ -147,7 +147,7 @@ const FeedItemImpl = ({
       <div
         className={cn(
           "flex min-w-0 items-center",
-          feed.errorAt && "text-red-900",
+          feed.errorAt && "text-red-900 dark:text-red-500",
         )}
       >
         <FeedIcon feed={feed} size={16} />

diff --git a/src/renderer/src/modules/feed-column/list.tsx b/src/renderer/src/modules/feed-column/list.tsx
@@ -41,11 +41,9 @@ const useGroupedData = (view: FeedViewType) => {
 export function FeedList({
   className,
   view,
-  hideTitle,
 }: {
   className?: string
   view: number
-  hideTitle?: boolean
 }) {
   const [expansion, setExpansion] = useState(false)
   const data = useGroupedData(view)
@@ -92,42 +90,40 @@ export function FeedList({
 
   return (
     <div className={cn(className, "font-medium")}>
-      {!hideTitle && (
+      <div
+        onClick={stopPropagation}
+        className="mx-3 mb-2 flex items-center justify-between px-2.5 py-1"
+      >
         <div
-          onClick={stopPropagation}
-          className="mx-3 mb-2 flex items-center justify-between px-2.5 py-1"
+          className="font-bold"
+          onClick={(e) => {
+            e.stopPropagation()
+            if (view !== undefined) {
+              navigate({
+                entryId: null,
+                feedId: null,
+                view,
+              })
+            }
+          }}
         >
-          <div
-            className="font-bold"
-            onClick={(e) => {
-              e.stopPropagation()
-              if (view !== undefined) {
-                navigate({
-                  entryId: null,
-                  feedId: null,
-                  view,
-                })
-              }
-            }}
-          >
-            {view !== undefined && views[view].name}
-          </div>
-          <div className="ml-2 flex items-center gap-3 text-sm text-theme-vibrancyFg">
-            {expansion ? (
-              <i
-                className="i-mgc-list-collapse-cute-fi"
-                onClick={() => setExpansion(false)}
-              />
-            ) : (
-              <i
-                className="i-mgc-list-expansion-cute-fi"
-                onClick={() => setExpansion(true)}
-              />
-            )}
-            <span>{totalUnread}</span>
-          </div>
+          {view !== undefined && views[view].name}
+        </div>
+        <div className="ml-2 flex items-center gap-3 text-sm text-theme-vibrancyFg">
+          {expansion ? (
+            <i
+              className="i-mgc-list-collapse-cute-fi"
+              onClick={() => setExpansion(false)}
+            />
+          ) : (
+            <i
+              className="i-mgc-list-expansion-cute-fi"
+              onClick={() => setExpansion(true)}
+            />
+          )}
+          <span>{totalUnread}</span>
         </div>
-      )}
+      </div>
       <ScrollArea.ScrollArea flex viewportClassName="!px-3">
         <div
           className={cn(
@@ -148,7 +144,7 @@ export function FeedList({
           <i className="i-mgc-star-cute-fi mr-2 text-orange-500" />
           Starred
         </div>
-        {hasData ?
+        {hasData ? (
           sortedByUnread?.map(([category, ids]) => (
             <FeedCategory
               showUnreadCount={showUnreadCount}
@@ -157,19 +153,19 @@ export function FeedList({
               view={view}
               expansion={expansion}
             />
-          )) :
-            !hideTitle && (
-              <div className="flex h-full flex-1 items-center text-zinc-500">
-                <Link
-                  to="/discover"
-                  className="-mt-36 flex h-full flex-1 cursor-default flex-col items-center justify-center gap-2"
-                  onClick={stopPropagation}
-                >
-                  <i className="i-mgc-add-cute-re text-3xl" />
-                  Add some feeds
-                </Link>
-              </div>
-            )}
+          ))
+        ) : (
+          <div className="flex h-full flex-1 items-center text-zinc-500">
+            <Link
+              to="/discover"
+              className="-mt-36 flex h-full flex-1 cursor-default flex-col items-center justify-center gap-2"
+              onClick={stopPropagation}
+            >
+              <i className="i-mgc-add-cute-re text-3xl" />
+              Add some feeds
+            </Link>
+          </div>
+        )}
       </ScrollArea.ScrollArea>
     </div>
   )