From 6bb75d692f374760c92f87cf37b667d7c3098f6e Mon Sep 17 00:00:00 2001
From: qt-coder <chuchenkhang@gmail.com>
Date: Tue, 29 Jun 2021 07:58:12 +0800
Subject: [PATCH] Added simple footer

---
 components/Footer/Copyright.js        |  8 +++++
 components/Footer/Footer.js           | 15 +++++++++
 components/Footer/SocialMediaLinks.js |  9 ++++++
 pages/index.js                        | 44 ++++++++++++++-------------
 yarn.lock                             | 22 ++++++++++++++
 5 files changed, 77 insertions(+), 21 deletions(-)
 create mode 100644 components/Footer/Copyright.js
 create mode 100644 components/Footer/Footer.js
 create mode 100644 components/Footer/SocialMediaLinks.js

diff --git a/components/Footer/Copyright.js b/components/Footer/Copyright.js
new file mode 100644
index 0000000..2c9d08a
--- /dev/null
+++ b/components/Footer/Copyright.js
@@ -0,0 +1,8 @@
+import { Text, TextProps } from '@chakra-ui/layout'
+import * as React from 'react'
+
+export const Copyright = (props) => (
+    <Text fontSize="sm" {...props}>
+        &copy; {new Date().getFullYear()} Cath. All rights reserved.
+    </Text>
+)
\ No newline at end of file
diff --git a/components/Footer/Footer.js b/components/Footer/Footer.js
new file mode 100644
index 0000000..e3325eb
--- /dev/null
+++ b/components/Footer/Footer.js
@@ -0,0 +1,15 @@
+import { Box, Stack } from '@chakra-ui/react'
+import * as React from 'react'
+import { Copyright } from './Copyright'
+import { SocialMediaLinks } from './SocialMediaLinks'
+
+export const Footer = () => (
+    <Box as="footer" role="contentinfo" mx="auto" maxW="7xl" py="12" px={{ base: '4', md: '8' }}>
+        <Stack>
+            <Stack direction="row" spacing="4" align="center" justify="space-between">
+                <SocialMediaLinks />
+            </Stack>
+            <Copyright alignSelf={{ base: 'center', sm: 'start' }} />
+        </Stack>
+    </Box>
+)
\ No newline at end of file
diff --git a/components/Footer/SocialMediaLinks.js b/components/Footer/SocialMediaLinks.js
new file mode 100644
index 0000000..1cf5433
--- /dev/null
+++ b/components/Footer/SocialMediaLinks.js
@@ -0,0 +1,9 @@
+import { ButtonGroup, ButtonGroupProps, IconButton } from '@chakra-ui/react'
+import * as React from 'react'
+import { FaGithub } from 'react-icons/fa'
+
+export const SocialMediaLinks = (props) => (
+    <ButtonGroup variant="ghost" color="gray.600" {...props}>
+        <IconButton as="a" href="https://github.com/night0721/cath.gq" aria-label="GitHub" icon={<FaGithub fontSize="20px" />} target='_empty'/>
+    </ButtonGroup>
+)
\ No newline at end of file
diff --git a/pages/index.js b/pages/index.js
index 5f7d154..b6fa385 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -2,34 +2,36 @@ import Card from '../components/Card'
 import { useSession } from 'next-auth/client'
 import { Text } from "@chakra-ui/react"
 import Hero from '../components/Hero/Hero'
-import {CTA} from '../components/CTA'
+import { CTA } from '../components/CTA'
 import { Features } from '../components/Features/Features'
+import {Footer} from '../components/Footer/Footer'
 
 export default function Home() {
 
   const [session, loading] = useSession()
 
   return (
-  
-  <>
-    {!session && <>
-      <Hero title='Cath.exe' subtitle='Your favorite CODM bot. Cath.exe is packed to the brim with commands for moderation, stats and of course, CODM.' ctaText='Sign In' image='/logo.png'/>
-      <Features/>
-      <CTA/>
+
+    <>
+      {!session && <>
+        <Hero title='Cath.exe' subtitle='Your favorite CODM bot. Cath.exe is packed to the brim with commands for moderation, stats and of course, CODM.' ctaText='Sign In' image='/logo.png' />
+        <Features />
+        <CTA />
+        <Footer />
+      </>
+      }
+      {session && <>
+        <Text fontSize='4xl'>Welcome {session.user.name}!</Text>
+        <div className='grid'>
+          <Card title='commands' desc='lorem ipsum dolor sit amet' link='/controlpanel/commands' />
+          <Card title='commands' desc='lorem ipsum dolor sit amet' link='/controlpanel/commands' />
+          <Card title='commands' desc='lorem ipsum dolor sit amet' link='/controlpanel/commands' />
+          <Card title='commands' desc='lorem ipsum dolor sit amet' link='/controlpanel/commands' />
+          <Card title='commands' desc='lorem ipsum dolor sit amet' link='/controlpanel/commands' />
+          <Card title='commands' desc='lorem ipsum dolor sit amet' link='/controlpanel/commands' />
+        </div>
+      </>
+      }
     </>
-  }
-  {session && <>
-      <Text fontSize='4xl'>Welcome {session.user.name}!</Text>
-      <div className='grid'>
-        <Card title='commands' desc='lorem ipsum dolor sit amet' link='/controlpanel/commands'/>
-        <Card title='commands' desc='lorem ipsum dolor sit amet' link='/controlpanel/commands'/>
-        <Card title='commands' desc='lorem ipsum dolor sit amet' link='/controlpanel/commands'/>
-        <Card title='commands' desc='lorem ipsum dolor sit amet' link='/controlpanel/commands'/>
-        <Card title='commands' desc='lorem ipsum dolor sit amet' link='/controlpanel/commands'/>
-        <Card title='commands' desc='lorem ipsum dolor sit amet' link='/controlpanel/commands'/>
-      </div>
-    </>
-  }
-  </>
   )
 }
diff --git a/yarn.lock b/yarn.lock
index 984c912..9723350 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1075,6 +1075,19 @@
     "@typescript-eslint/types" "4.27.0"
     eslint-visitor-keys "^2.0.0"
 
+"@widgetbot/embed-api@^1.1.3":
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/@widgetbot/embed-api/-/embed-api-1.1.3.tgz#c7fd8069d7ce2ec7740d8bf4140c786c636fb3d6"
+  integrity sha1-x/2AadfOLsd0DYv0FAx4bGNvs9Y=
+
+"@widgetbot/react-embed@^1.4.0":
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/@widgetbot/react-embed/-/react-embed-1.4.0.tgz#b0b617629e0e2cd6ff7a4770db34e0c52e056a43"
+  integrity sha512-rN/zyv8ndn+I3g1fCMql2NN+2Yn04XVhwL1GHQlSKEvFWNXsqEDyXO1MaDxcvJFcG7cSQLRTcvgVWzAVe+3Fag==
+  dependencies:
+    "@widgetbot/embed-api" "^1.1.3"
+    react "^16.13.1"
+
 acorn-jsx@^5.3.1:
   version "5.3.1"
   resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.3.1.tgz#fc8661e11b7ac1539c47dbfea2e72b3af34d267b"
@@ -3945,6 +3958,15 @@ react@17.0.2:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
 
+react@^16.13.1:
+  version "16.14.0"
+  resolved "https://registry.yarnpkg.com/react/-/react-16.14.0.tgz#94d776ddd0aaa37da3eda8fc5b6b18a4c9a3114d"
+  integrity sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==
+  dependencies:
+    loose-envify "^1.1.0"
+    object-assign "^4.1.1"
+    prop-types "^15.6.2"
+
 read-pkg-up@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/read-pkg-up/-/read-pkg-up-3.0.0.tgz#3ed496685dba0f8fe118d0691dc51f4a1ff96f07"