ダークモードをちょっと明るくした

Author: na-trium-144

app/globals.css

@@ -56,17 +56,17 @@ mycdark:
   default: false;
   prefersdark: true;
   color-scheme: "dark";
-  --color-base-100: oklch(20% 0.016 61.15);
-  --color-base-200: oklch(16.5% 0.016 61.15);
-  --color-base-300: oklch(10% 0.016 61.15);
+  --color-base-100: oklch(23.0% 0.020 61.15);
+  --color-base-200: oklch(19.0% 0.020 61.15);
+  --color-base-300: oklch(10.0% 0.020 61.15);
   --color-base-content: oklch(85% 0.01 61.15);
   --color-primary: oklch(70% 0.139 61.15);
   --color-primary-content: oklch(26% 0.07 61.15);
   --color-secondary: oklch(65% 0.262 315);
   --color-secondary-content: oklch(18% 0.191 315);
   --color-accent: oklch(61% 0.181 190);
   --color-accent-content: oklch(18% 0.152 190);
-  --color-neutral: oklch(30% 0.07 61.15);
+  --color-neutral: oklch(33.0% 0.070 61.15);
   --color-neutral-content: oklch(85% 0.01 61.15);
   --color-info: oklch(54.615% 0.215 262.88);
   --color-info-content: oklch(90.923% 0.043 262.88);

app/page.tsx

@@ -43,10 +43,8 @@ export default function Home() {
               key={group.id}
               href={`${group.id}-${group.pages[0].id}`}
               className={clsx(
-                "card card-border card-md shadow-lg hover:shadow-xl transition-all hover:-translate-y-1",
-                // lightテーマではbase-100の背景にbase-100のカードでも違和感ないんだけど、
-                // darkテーマではそれだと見えないので、色を変えている
-                "dark:bg-neutral dark:text-neutral-content"
+                "card card-border card-md bg-base-200 shadow-lg",
+                "hover:shadow-xl transition-all hover:-translate-y-1",
               )}
             >
               <div className="card-body">