refactor: refactor import paths and remove unused code

Foxtrot-Command · Feb 4, 2024 · b8c329b · b8c329b
1 parent 268a276
commit b8c329b
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 18 deletions.
diff --git a/src/common/components/Common/Navbar.tsx → src/common/components/Navbar.tsx b/src/common/components/Common/Navbar.tsx → src/common/components/Navbar.tsx
@@ -22,7 +22,6 @@ import {
   Stack,
   Text,
   useBreakpointValue,
-  useColorModeValue,
   useDisclosure,
 } from "@chakra-ui/react";
 
@@ -61,7 +60,7 @@ export default function Navbar() {
           <Text
             textAlign={useBreakpointValue({ base: "center", md: "left" })}
             fontFamily={"heading"}
-            color={useColorModeValue("gray.800", "white")}
+            color="white"
           >
             <Link href="/">
               <Image style={{ width: "128px" }} src="/images/fxd_logo.svg" />
@@ -112,9 +111,6 @@ export default function Navbar() {
 }
 
 const DesktopNav = () => {
-  const linkColor = useColorModeValue("gray.600", "gray.200");
-  const linkHoverColor = useColorModeValue("gray.800", "white");
-  const popoverContentBgColor = useColorModeValue("white", "gray.800");
 
   return (
     <Stack direction={"row"} spacing={4}>
@@ -128,10 +124,10 @@ const DesktopNav = () => {
                 href={navItem.href ?? "#"}
                 fontSize={"sm"}
                 fontWeight={500}
-                color={linkColor}
+                color="dust.600"
                 _hover={{
                   textDecoration: "none",
-                  color: linkHoverColor,
+                  color: "dust.800",
                 }}
               >
                 {navItem.label}
@@ -142,7 +138,7 @@ const DesktopNav = () => {
               <PopoverContent
                 border={0}
                 boxShadow={"xl"}
-                bg={popoverContentBgColor}
+                bg="neutrals.500"
                 p={4}
                 rounded={"xl"}
                 minW={"sm"}
@@ -168,7 +164,7 @@ const DesktopSubNav = ({ label, href = "", subLabel }: NavItem) => {
       display={"block"}
       p={2}
       rounded={"md"}
-      _hover={{ bg: useColorModeValue("neutrals.100", "gray.900") }}
+      _hover={{ bg: "neutrals.900" }}
     >
       <Stack direction={"row"} align={"center"}>
         <Box cursor="pointer">
@@ -202,7 +198,7 @@ const DesktopSubNav = ({ label, href = "", subLabel }: NavItem) => {
 const MobileNav = () => {
   return (
     <Stack
-      bg={useColorModeValue("white", "gray.800")}
+      bg={"neutrals.500"}
       p={4}
       display={{ md: "none" }}
     >
@@ -230,7 +226,7 @@ const MobileNavItem = ({ label, children, href }: NavItem) => {
       >
         <Text
           fontWeight={600}
-          color={useColorModeValue("gray.600", "gray.200")}
+          color="neutrals.200"
         >
           {label}
         </Text>
@@ -251,7 +247,7 @@ const MobileNavItem = ({ label, children, href }: NavItem) => {
           pl={4}
           borderLeft={1}
           borderStyle={"solid"}
-          borderColor={useColorModeValue("gray.200", "gray.700")}
+          borderColor="neutrals.700"
           align={"start"}
         >
           {children &&

diff --git a/src/common/components/index.ts b/src/common/components/index.ts
@@ -1,4 +1,4 @@
 export { default as Layout } from "../layout/BaseLayout";
-export { default as Navbar } from "./Common/Navbar";
+export { default as Navbar } from "./Navbar";
 export { default as DropdownMenu } from "./DropdownMenu";
 export { default as SliderOpacity } from "./SliderOpacity";
diff --git a/src/common/layout/BaseLayout.tsx b/src/common/layout/BaseLayout.tsx
@@ -2,7 +2,7 @@ import { ReactNode } from "react";
 
 import { Container } from "@chakra-ui/react";
 
-import Navbar from "../components/Common/Navbar";
+import Navbar from "../components/Navbar";
 
 type BaseLayoutProps = { children: ReactNode };
 

diff --git a/src/common/setup/theme/chakra/components/Input.ts b/src/common/setup/theme/chakra/components/Input.ts
@@ -33,7 +33,6 @@ const Input: DeepPartial<ChakraTheme["components"]["Input"]> = {
     md: {
       field: {
         borderRadius: '4px',
-        height: 12,
         fontSize: 'md',
       },
     },

diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
@@ -1,11 +1,11 @@
 import type { AppProps } from "next/app";
 import Head from "next/head";
 
-import { ChakraProvider } from "@chakra-ui/react";
+import { ChakraProvider, ColorModeScript } from "@chakra-ui/react";
 import "@fontsource/montserrat/latin.css";
 import Layout from "common/layout/BaseLayout";
-import "common/styles/theme/globals.css";
-import fxdTheme from "common/styles/theme/FXDTheme";
+import "common/setup/theme/globals.css";
+import fxdTheme from "common/setup/theme/FXDTheme";
 
 function App({ Component, pageProps }: AppProps) {
   return (
@@ -21,6 +21,7 @@ function App({ Component, pageProps }: AppProps) {
           crossOrigin=""
         />
       </Head>
+      <ColorModeScript initialColorMode={fxdTheme.config.initialColorMode} />
       <ChakraProvider resetCSS theme={fxdTheme}>
         <Layout>
           <Component {...pageProps} />