fix: update divider color to correctly work on darkmode

won23 · Sep 23, 2020 · a550f90 · a550f90
1 parent 811e7b0
commit a550f90
Showing 1 changed file with 8 additions and 1 deletion.
diff --git a/src/pages/contact.tsx b/src/pages/contact.tsx
@@ -6,12 +6,16 @@ import {
   Flex,
   Divider,
   Link as ChakraLink,
+  useColorMode,
 } from '@chakra-ui/core';
 import Reference from 'src/components/Reference';
+import customTheme from 'src/styles/theme';
 
 export interface IContactProps {}
 
 export default function Contact(props: IContactProps) {
+  const { colorMode } = useColorMode();
+
   const contactItems = [
     {
       title: 'Email',
@@ -36,7 +40,10 @@ export default function Contact(props: IContactProps) {
         <Heading size="sm" as="h3">
           {props.title}
         </Heading>
-        <Divider width="10%" borderColor="black"></Divider>
+        <Divider
+          width="10%"
+          borderColor={customTheme.mode[colorMode].color}
+        ></Divider>
         <Reference link={{ href: props.src, external: true }}>
           {props.linkName ? props.linkName : props.src}
         </Reference>