From 7b91944fbf60c27d21274ddb7f28f97344c89ef5 Mon Sep 17 00:00:00 2001
From: molvqingtai <molvqingtai@gmail.com>
Date: Wed, 30 Oct 2024 22:33:09 +0800
Subject: [PATCH] perf: optimize theme style

---
 src/app/content/views/Footer/index.tsx |  2 +-
 src/components/Markdown.tsx            | 13 +++++++++++--
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/app/content/views/Footer/index.tsx b/src/app/content/views/Footer/index.tsx
index a6acf9d..3a4714a 100644
--- a/src/app/content/views/Footer/index.tsx
+++ b/src/app/content/views/Footer/index.tsx
@@ -323,7 +323,7 @@ const Footer: FC = () => {
                     <AvatarImage className="size-full" src={user.userAvatar} alt="avatar" />
                     <AvatarFallback>{user.username.at(0)}</AvatarFallback>
                   </Avatar>
-                  <div className="flex-1 truncate text-xs text-slate-500">{user.username}</div>
+                  <div className="flex-1 truncate text-xs text-slate-500 dark:text-slate-50">{user.username}</div>
                 </div>
               )}
             ></Virtuoso>
diff --git a/src/components/Markdown.tsx b/src/components/Markdown.tsx
index 34c8db9..797c651 100644
--- a/src/components/Markdown.tsx
+++ b/src/components/Markdown.tsx
@@ -46,12 +46,21 @@ const Markdown: FC<MarkdownProps> = ({ children = '', className }) => {
       urlTransform={urlTransform}
       components={{
         h1: ({ className, ...props }) => (
-          <h1 className={cn('my-2 mt-0 font-semibold text-2xl', className)} {...props} />
+          <h1 className={cn('my-2 mt-0 font-semibold text-2xl dark:text-slate-50', className)} {...props} />
+        ),
+        h2: ({ className, ...props }) => (
+          <h2 className={cn('mb-2 mt-0 font-semibold dark:text-slate-50', className)} {...props} />
+        ),
+        h3: ({ className, ...props }) => (
+          <h3 className={cn('mb-2 mt-0 font-semibold dark:text-slate-50', className)} {...props} />
+        ),
+        h4: ({ className, ...props }) => (
+          <h4 className={cn('mb-2 mt-0 font-semibold dark:text-slate-50', className)} {...props} />
         ),
-        h2: ({ className, ...props }) => <h2 className={cn('mb-2 mt-0 font-semibold', className)} {...props} />,
         img: ({ className, alt, ...props }) => (
           <img className={cn('my-2 max-w-[100%] rounded', className)} alt={alt} {...props} />
         ),
+        strong: ({ className, ...props }) => <strong className={cn('dark:text-slate-50', className)} {...props} />,
         a: ({ className, ...props }) => (
           <a
             className={cn('text-blue-500', className)}