feat: dark mode colors

1 files changed, 24 insertions, 2 deletions

diff --git a/lib/theme.tsx b/lib/theme.tsx
index 2309bff..a7ae222 100644
--- a/lib/theme.tsx
+++ b/lib/theme.tsx
@@ -2,12 +2,34 @@ import { extendTheme ,type ThemeConfig } from "@chakra-ui/react"
 import { mode } from '@chakra-ui/theme-tools'
 import type { StyleFunctionProps } from '@chakra-ui/styled-system'
 
+const styles = {
+  global: (props : StyleFunctionProps) => ({
+    body: {
+      bg: mode('#d5d6db', '#282a36')(props),
+      color: mode('#0f4b6e', '#f8f8f2')(props),
+    }
+  })
+}
+
+const components = {
+  Link: {
+    baseStyle: (props : StyleFunctionProps)  => ({
+      color: mode('#3d7aed', '#bd93f9')(props),
+      textUnderlineOffset: 3
+    })
+  },
+  Text: {
+    baseStyle: (_props : StyleFunctionProps)  => ({
+      textAlign: "justify",
+    })
+  }
+}
+
 const config: ThemeConfig = {
   initialColorMode: 'light',
   useSystemColorMode: false,
 }
 
-// 3. extend the theme
-const theme = extendTheme({ config })
+const theme = extendTheme({ config, styles, components })
 
 export default theme