fix merge issues

components/constants/header.tsx

@@ -1,6 +1,6 @@
-export const HEADER_TITLE: string = 'Woolball a Global Link System'
+export const HEADER_TITLE: string = 'Woolball - The ID System with Links'
 export const HEADER_DESCRIPTION: string =
-  'Woolball is global link systems that creates connections between people, dApps, DAOs and platforms in Web3.'
+  'Woolball is the ID system that uses links to create on-chain connections between people, dApps, DAOs and platforms in Web3.'
 
 export const HEADER_IMAGE: string =
-  'https://woolball.xyz/images/screenshot.jpg?v=3'
+  'https://woolball.xyz/images/screenshot.jpg?v=4'

pages/index.tsx

@@ -19,10 +19,8 @@ import { useState } from "react";
 import GiantLogo from '../components/landing_page/giant_logo'
 import Roadmap from '../components/landing_page/road_map'
 import ActionButtons from '../components/landing_page/action_buttons'
-import ArrowIcon from '../components/svgs/arrow'
 import UseCase from '../components/landing_page/use_case'
 import Layout from '../components/layout'
-import NextLink from 'next/link'
 
 export default function Home() {
   const [name, setName] = useState('');

pages/what-is-woolball.tsx

@@ -6,9 +6,9 @@ import {
   Text,
   Image,
   Show,
+  Link,
   UnorderedList,
   ListItem,
-  Link,
 } from '@chakra-ui/react'
 import { GetStaticProps, NextPage } from 'next'
 import { GITHUB_LINK } from '../components/constants/social_profiles'
@@ -77,7 +77,7 @@ const WhatIsWoolballPage: NextPage = ({}) => {
           alignItems="stretch"
           align="flex-start"
           maxW="3xl"
-          spacing={{ base: 4, lg: 6 }}
+          spacing={{ base: 8, lg: 10 }}
           fontSize={{ base: '14px', sm: '18px' }}
           lineHeight={{ base: '22px', sm: '28px' }}
         >