fix: resolve inline code visibility issue in light mode by adding 'codeBackground' color #460

Author: arty0928

apps/landing/devup.json

@@ -8,6 +8,7 @@
         "text": "#2F2F2F",
         "background": "#FFF",
         "containerBackground": "#FFF",
+        "codeBackground": "#F5F5F5",
         "border": "#E0E0E0",
         "success": "#4CAF50",
         "warning": "#FF9800",
@@ -53,6 +54,7 @@
         "text": "#EDEDED",
         "background": "#131313",
         "containerBackground": "#373639",
+        "codeBackground": "#2E2E2E",
         "border": "#333",
         "success": "#4CAF50",
         "warning": "#FF9800",

apps/landing/src/components/mdx/components/CustomCodeBlock.tsx

@@ -4,7 +4,7 @@ export function CustomCodeBlock({ children }: { children: string }) {
   return (
     <Box
       as="code"
-      bg="$containerBackground"
+      bg="$codeBackground"
       borderRadius="0.25rem"
       color="$text"
       padding="0.25rem"

packages/components/devup.json

@@ -11,6 +11,7 @@
         "text": "#272727",
         "background": "#F5F5F5",
         "containerBackground": "#FFFFFF",
+        "codeBackground": "#F5F5F5",
         "border": "#E4E4E4",
         "success": "#2CA353",
         "warning": "#FF9800",
@@ -74,6 +75,7 @@
         "text": "#F6F6F6",
         "background": "#202020",
         "containerBackground": "#1E1E1E",
+        "codeBackground": "#2E2E2E",
         "border": "#434343",
         "success": "#4CAF50",
         "warning": "#FF9800",