From 27eb23c9d06934040f0fe9645e85421f0efab5ca Mon Sep 17 00:00:00 2001
From: daidr <daidr@daidr.me>
Date: Fri, 14 Apr 2023 00:37:10 +0800
Subject: [PATCH 1/4] fix: dark scheme for native GUI

---
 src/css/tailwind.css | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/css/tailwind.css b/src/css/tailwind.css
index 89bf714f..45986e6d 100644
--- a/src/css/tailwind.css
+++ b/src/css/tailwind.css
@@ -21,6 +21,10 @@
   border-color: var(--border-color);
 }
 
+html.dark {
+  color-scheme: dark;
+}
+
 body {
   @apply break-words bg-white;
 }

From c89a974bb307a5f2a6e76fbf9ee0be6d30f01480 Mon Sep 17 00:00:00 2001
From: daidr <daidr@daidr.me>
Date: Fri, 14 Apr 2023 01:08:08 +0800
Subject: [PATCH 2/4] fix: border color

---
 src/components/common/CharacterCard.tsx       | 2 +-
 src/components/common/ConnectButton.tsx       | 2 +-
 src/components/dashboard/PagesManagerMenu.tsx | 2 +-
 src/components/site/SiteHeader.tsx            | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/common/CharacterCard.tsx b/src/components/common/CharacterCard.tsx
index c92b43c5..41f11c5a 100644
--- a/src/components/common/CharacterCard.tsx
+++ b/src/components/common/CharacterCard.tsx
@@ -51,7 +51,7 @@ export const CharacterCard: React.FC<{
   return (
     <span
       className={cn(
-        "border-gray-100 rounded-lg text-sm block cursor-default",
+        "border-border border rounded-lg text-sm block cursor-default",
         style === "flat" ? "" : "p-4 bg-white shadow-xl",
         simple ? "space-y-1" : "space-y-2",
       )}
diff --git a/src/components/common/ConnectButton.tsx b/src/components/common/ConnectButton.tsx
index 79c4b583..410f9597 100644
--- a/src/components/common/ConnectButton.tsx
+++ b/src/components/common/ConnectButton.tsx
@@ -278,7 +278,7 @@ export const ConnectButton: React.FC<{
                   }
                   dropdown={
                     <div
-                      className={`text-gray-600 bg-white rounded-lg ring-1 ring-zinc-100 min-w-[140px] shadow-md py-2 ${
+                      className={`text-gray-600 bg-white rounded-lg ring-1 ring-border min-w-[140px] shadow-md py-2 ${
                         size === "base" ? "text-base" : "text-sm"
                       } mt-1`}
                     >
diff --git a/src/components/dashboard/PagesManagerMenu.tsx b/src/components/dashboard/PagesManagerMenu.tsx
index 6ab624c1..62a632cf 100644
--- a/src/components/dashboard/PagesManagerMenu.tsx
+++ b/src/components/dashboard/PagesManagerMenu.tsx
@@ -166,7 +166,7 @@ export const PagesManagerMenu: FC<{
   }, [])
 
   return (
-    <Menu.Items className="text-sm absolute z-20 right-0 bg-white shadow-modal rounded-lg overflow-hidden py-2 w-64">
+    <Menu.Items className="text-sm absolute z-20 right-0 bg-white shadow-modal rounded-lg overflow-hidden py-2 w-64 ring-1 ring-border">
       {items.map((item) => {
         return (
           <Menu.Item key={item.text}>
diff --git a/src/components/site/SiteHeader.tsx b/src/components/site/SiteHeader.tsx
index 87597982..1678f0d5 100644
--- a/src/components/site/SiteHeader.tsx
+++ b/src/components/site/SiteHeader.tsx
@@ -259,7 +259,7 @@ export const SiteHeader: React.FC<{
                         </Button>
                       }
                       dropdown={
-                        <div className="text-gray-600 bg-white rounded-lg ring-1 ring-zinc-100 shadow-md py-2 text-sm">
+                        <div className="text-gray-600 bg-white rounded-lg ring-1 ring-border shadow-md py-2 text-sm">
                           {moreMenuItems.map((item) => {
                             return (
                               <UniLink

From a1d063c0a42c1333075469221f5312a22db73b2a Mon Sep 17 00:00:00 2001
From: daidr <daidr@daidr.me>
Date: Fri, 14 Apr 2023 01:32:43 +0800
Subject: [PATCH 3/4] fix: lottie logo color in dark mode

---
 src/components/common/Logo.tsx | 1 +
 src/css/tailwind.css           | 4 ++++
 2 files changed, 5 insertions(+)

diff --git a/src/components/common/Logo.tsx b/src/components/common/Logo.tsx
index d940a4dc..559f36ea 100644
--- a/src/components/common/Logo.tsx
+++ b/src/components/common/Logo.tsx
@@ -43,6 +43,7 @@ export const Logo: React.FC<{
             width: width || 100,
             height: height || 100,
           }}
+          className="xlog-lottie-logo"
         />
       )
   }
diff --git a/src/css/tailwind.css b/src/css/tailwind.css
index 45986e6d..4daed119 100644
--- a/src/css/tailwind.css
+++ b/src/css/tailwind.css
@@ -364,3 +364,7 @@ textarea.input {
   border-right-color: currentColor;
   @apply animate-spin;
 }
+
+.xlog-lottie-logo path[fill="rgb(0,0,0)"] {
+  @apply fill-current;
+}

From c71b4793d8c4e3b72977e87f12bee576193bcd6c Mon Sep 17 00:00:00 2001
From: daidr <daidr@daidr.me>
Date: Fri, 14 Apr 2023 01:59:04 +0800
Subject: [PATCH 4/4] fix: text color in achievement modal

---
 src/components/common/AchievementModal.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/common/AchievementModal.tsx b/src/components/common/AchievementModal.tsx
index a33ddecc..d761fc36 100644
--- a/src/components/common/AchievementModal.tsx
+++ b/src/components/common/AchievementModal.tsx
@@ -103,10 +103,10 @@ export const AchievementModal: React.FC<{
             />
           </Tilt>
           <div className="inline-flex flex-col flex-1 min-w-0 w-full space-y-1">
-            <span className="capitalize text-4xl font-medium truncate">
+            <span className="capitalize text-black text-4xl font-medium truncate">
               {group.info.title} {achievement && `#${achievement.tokenId}`}
             </span>
-            <span className="text-lg text-gray-100 capitalize truncate">
+            <span className="text-lg text-black capitalize truncate">
               {
                 (achievement || achievementMintable || achievementComming)!.info
                   .description