Added simple footer
This commit is contained in:
parent
1c491c927e
commit
6bb75d692f
5 changed files with 77 additions and 21 deletions
8
components/Footer/Copyright.js
Normal file
8
components/Footer/Copyright.js
Normal 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}>
|
||||
© {new Date().getFullYear()} Cath. All rights reserved.
|
||||
</Text>
|
||||
)
|
15
components/Footer/Footer.js
Normal file
15
components/Footer/Footer.js
Normal 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>
|
||||
)
|
9
components/Footer/SocialMediaLinks.js
Normal file
9
components/Footer/SocialMediaLinks.js
Normal 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>
|
||||
)
|
|
@ -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>
|
||||
</>
|
||||
}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
22
yarn.lock
22
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"
|
||||
|
|
Loading…
Reference in a new issue