108 lines
3.6 KiB
JavaScript
108 lines
3.6 KiB
JavaScript
import React from "react";
|
|
import {
|
|
chakra,
|
|
Box,
|
|
useColorModeValue,
|
|
Button,
|
|
Stack,
|
|
Image,
|
|
Text,
|
|
Icon,
|
|
} from "@chakra-ui/react";
|
|
import { signIn } from "next-auth/client";
|
|
|
|
const Hero = () => {
|
|
return (
|
|
<Box px={8} py={24} mx="auto">
|
|
<Box
|
|
w={{ base: "full", md: 11 / 12, xl: 9 / 12 }}
|
|
mx="auto"
|
|
textAlign={{ base: "left", md: "center" }}
|
|
>
|
|
<chakra.h1
|
|
mb={6}
|
|
fontSize={{ base: "4xl", md: "6xl" }}
|
|
fontWeight="bold"
|
|
lineHeight="none"
|
|
letterSpacing={{ base: "normal", md: "tight" }}
|
|
color={useColorModeValue("gray.900", "gray.100")}
|
|
>
|
|
Your favorite{" "}
|
|
<Text
|
|
display={{ base: "block", lg: "inline" }}
|
|
w="full"
|
|
bgClip="text"
|
|
bgGradient="linear(to-r, rgba(0,76,213,1) 0%, rgba(0,99,255,1) 50%, rgba(0,183,255,1) 100%)"
|
|
fontWeight="extrabold"
|
|
>
|
|
CODM
|
|
</Text>{" "}
|
|
bot.
|
|
</chakra.h1>
|
|
<chakra.p
|
|
px={{ base: 0, lg: 24 }}
|
|
mb={6}
|
|
fontSize={{ base: "lg", md: "xl" }}
|
|
color={useColorModeValue("gray.600", "gray.300")}
|
|
>
|
|
Your favorite CODM bot. Cath.exe is packed to the brim with commands
|
|
for moderation, stats and of course, CODM.
|
|
</chakra.p>
|
|
<Stack
|
|
direction={{ base: "column", sm: "row" }}
|
|
mb={{ base: 4, md: 8 }}
|
|
spacing={2}
|
|
justifyContent={{ sm: "left", md: "center" }}
|
|
>
|
|
<Button
|
|
as="a"
|
|
variant="solid"
|
|
colorScheme="blue"
|
|
display="inline-flex"
|
|
alignItems="center"
|
|
justifyContent="center"
|
|
w={{ base: "full", sm: "auto" }}
|
|
mb={{ base: 2, sm: 0 }}
|
|
href={
|
|
"https://discord.com/api/oauth2/authorize?client_id=800966959268364288&permissions=4231314550&scope=bot%20applications.commands"
|
|
}
|
|
size="lg"
|
|
>
|
|
Invite Cath
|
|
<Icon boxSize={4} ml={1} viewBox="0 0 20 20" fill="currentColor">
|
|
<path
|
|
fillRule="evenodd"
|
|
d="M10.293 3.293a1 1 0 011.414 0l6 6a1 1 0 010 1.414l-6 6a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-4.293-4.293a1 1 0 010-1.414z"
|
|
clipRule="evenodd"
|
|
/>
|
|
</Icon>
|
|
</Button>
|
|
<Button
|
|
as="a"
|
|
colorScheme="gray"
|
|
display="inline-flex"
|
|
alignItems="center"
|
|
justifyContent="center"
|
|
w={{ base: "full", sm: "auto" }}
|
|
mb={{ base: 2, sm: 0 }}
|
|
onClick={() => {
|
|
signIn();
|
|
}}
|
|
size="lg"
|
|
>
|
|
Sign Up
|
|
<Icon boxSize={4} ml={1} viewBox="0 0 20 20" fill="currentColor">
|
|
<path
|
|
fillRule="evenodd"
|
|
d="M6.672 1.911a1 1 0 10-1.932.518l.259.966a1 1 0 001.932-.518l-.26-.966zM2.429 4.74a1 1 0 10-.517 1.932l.966.259a1 1 0 00.517-1.932l-.966-.26zm8.814-.569a1 1 0 00-1.415-1.414l-.707.707a1 1 0 101.415 1.415l.707-.708zm-7.071 7.072l.707-.707A1 1 0 003.465 9.12l-.708.707a1 1 0 001.415 1.415zm3.2-5.171a1 1 0 00-1.3 1.3l4 10a1 1 0 001.823.075l1.38-2.759 3.018 3.02a1 1 0 001.414-1.415l-3.019-3.02 2.76-1.379a1 1 0 00-.076-1.822l-10-4z"
|
|
clipRule="evenodd"
|
|
/>
|
|
</Icon>
|
|
</Button>
|
|
</Stack>
|
|
</Box>
|
|
</Box>
|
|
);
|
|
};
|
|
|
|
export default Hero;
|