From 77011060827ff87f5bffb8c80a7d9d26620ad14f Mon Sep 17 00:00:00 2001
From: tonytc13579 <tony@trustless.computer>
Date: Thu, 4 Jan 2024 18:29:12 +0700
Subject: [PATCH] Fix text , css

---
 src/layouts/Header/components/DesktopNav.tsx | 47 +++++++++++++++-----
 src/layouts/Header/components/IcTW.tsx       | 19 ++++++++
 src/layouts/Header/menuConfig.ts             |  4 +-
 src/modules/home/Section_2/index.tsx         |  2 +-
 4 files changed, 59 insertions(+), 13 deletions(-)
 create mode 100644 src/layouts/Header/components/IcTW.tsx

diff --git a/src/layouts/Header/components/DesktopNav.tsx b/src/layouts/Header/components/DesktopNav.tsx
index f914805c1..91772e099 100644
--- a/src/layouts/Header/components/DesktopNav.tsx
+++ b/src/layouts/Header/components/DesktopNav.tsx
@@ -1,9 +1,10 @@
 'use client';
 
-import { HStack, Text } from '@chakra-ui/react';
+import { Box, HStack, Text } from '@chakra-ui/react';
 
 import Link from 'next/link';
 import { NAV_ITEMS } from '../menuConfig';
+import { IcTW } from './IcTW';
 
 type Props = {
   primaryColor?: 'black' | 'white';
@@ -19,16 +20,40 @@ export const DesktopNav = (props: Props) => {
           target={navItem.isNewWindow ? '_blank' : '_self'}
           color={props?.primaryColor || 'white'}
         >
-          <Text
-            textAlign={'center'}
-            fontSize={['14px', '16px']}
-            lineHeight={'110%'}
-            fontWeight={500}
-            color={props.primaryColor || 'black'}
-            _hover={{}}
-          >
-            {navItem.label}
-          </Text>
+          {navItem?.isTwitter ? (
+            <Box
+              m={0}
+              p={'10px'}
+              display={'flex'}
+              alignItems={'center'}
+              borderRadius={100}
+              bgColor={
+                props?.primaryColor === 'white' ? '#b2b1b158' : '#fefefec5'
+              }
+              justifyContent={'center'}
+              _hover={{
+                opacity: 0.7,
+              }}
+              onClick={() => {
+                window.open(navItem.href, '_blank');
+              }}
+            >
+              <IcTW
+                fillColor={props?.primaryColor === 'white' ? 'white' : 'black'}
+              />
+            </Box>
+          ) : (
+            <Text
+              textAlign={'center'}
+              fontSize={['14px', '16px']}
+              lineHeight={'110%'}
+              fontWeight={500}
+              color={props.primaryColor || 'black'}
+              _hover={{}}
+            >
+              {navItem.label}
+            </Text>
+          )}
         </Link>
       ))}
     </HStack>
diff --git a/src/layouts/Header/components/IcTW.tsx b/src/layouts/Header/components/IcTW.tsx
new file mode 100644
index 000000000..5959535df
--- /dev/null
+++ b/src/layouts/Header/components/IcTW.tsx
@@ -0,0 +1,19 @@
+//#30ccfb
+const IcTW = ({ fillColor }: { fillColor?: string }) => {
+  return (
+    <svg
+      width="18"
+      height="16"
+      viewBox="0 0 18 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M17.7167 2.58329C17.075 2.87496 16.3833 3.06663 15.6667 3.15829C16.4 2.71663 16.9667 2.01663 17.2333 1.17496C16.5417 1.59163 15.775 1.88329 14.9667 2.04996C14.3083 1.33329 13.3833 0.916626 12.3333 0.916626C10.375 0.916626 8.77499 2.51663 8.77499 4.49163C8.77499 4.77496 8.80833 5.04996 8.86666 5.30829C5.89999 5.15829 3.25833 3.73329 1.49999 1.57496C1.19166 2.09996 1.01666 2.71663 1.01666 3.36663C1.01666 4.60829 1.64166 5.70829 2.60833 6.33329C2.01666 6.33329 1.46666 6.16663 0.983325 5.91663V5.94163C0.983325 7.67496 2.21666 9.12496 3.84999 9.44996C3.3256 9.59347 2.77507 9.61343 2.24166 9.50829C2.468 10.2187 2.91127 10.8403 3.50917 11.2857C4.10707 11.7312 4.82953 11.978 5.57499 11.9916C4.31135 12.992 2.74499 13.5327 1.13333 13.525C0.849992 13.525 0.566659 13.5083 0.283325 13.475C1.86666 14.4916 3.74999 15.0833 5.76666 15.0833C12.3333 15.0833 15.9417 9.63329 15.9417 4.90829C15.9417 4.74996 15.9417 4.59996 15.9333 4.44163C16.6333 3.94163 17.2333 3.30829 17.7167 2.58329Z"
+        fill={fillColor || 'white'}
+      />
+    </svg>
+  );
+};
+
+export { IcTW };
diff --git a/src/layouts/Header/menuConfig.ts b/src/layouts/Header/menuConfig.ts
index 183971e81..10afd53b0 100644
--- a/src/layouts/Header/menuConfig.ts
+++ b/src/layouts/Header/menuConfig.ts
@@ -5,6 +5,7 @@ export interface NavItem {
   isNewWindow?: boolean;
   href?: string;
   isHide?: boolean;
+  isTwitter?: boolean;
 }
 
 export const NAV_ITEMS: Array<NavItem> = [
@@ -27,13 +28,14 @@ export const NAV_ITEMS: Array<NavItem> = [
     isHide: false,
   },
   {
-    label: 'Whitepapers',
+    label: 'Whitepaper',
     href: 'https://_blank',
     isNewWindow: true,
     isHide: false,
   },
   {
     label: 'Twitter',
+    isTwitter: true,
     href: 'https://twitter.com/bvmnetwork',
     isNewWindow: true,
     isHide: false,
diff --git a/src/modules/home/Section_2/index.tsx b/src/modules/home/Section_2/index.tsx
index 02c42c7bc..2aad56423 100644
--- a/src/modules/home/Section_2/index.tsx
+++ b/src/modules/home/Section_2/index.tsx
@@ -83,7 +83,7 @@ const Section_2 = () => {
                   )
                 }
               >
-                {`${item.isComminSoon ? 'Comming soon' : 'View Project'}`}
+                {`${item.isComminSoon ? 'Coming soon' : 'View Project'}`}
               </Button>
             </HStack>
           </CardBody>