Added simple footer

This commit is contained in:
qt-coder 2021-06-29 07:58:12 +08:00
parent 1c491c927e
commit 6bb75d692f
5 changed files with 77 additions and 21 deletions

View file

@ -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>
)

View file

@ -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>
)

View file

@ -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>
)

View file

@ -2,8 +2,9 @@ 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() {
@ -11,25 +12,26 @@ export default function Home() {
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>
</>
}
</>
)
}

View file

@ -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"