diff --git a/components/Card.js b/components/Card.js
index 3ebf525..9011aa9 100644
--- a/components/Card.js
+++ b/components/Card.js
@@ -1,15 +1,26 @@
import React from 'react'
import Link from 'next/link'
import {Text, Flex, Button} from '@chakra-ui/react'
+import {motion} from 'framer-motion'
+
+const MotionFlex = motion(Flex)
+
+const item = {
+ hidden: { y: 20, opacity: 0 },
+ visible: {
+ y: 0,
+ opacity: 1
+ }
+}
function Card({title, desc, link}) {
return (
-
+
{title}
{desc}
-
+
)
}
diff --git a/components/StatCard.js b/components/StatCard.js
new file mode 100644
index 0000000..f00fa2c
--- /dev/null
+++ b/components/StatCard.js
@@ -0,0 +1,60 @@
+import {
+ Stat,
+ StatLabel,
+ StatNumber,
+ StatHelpText,
+ StatArrow,
+ StatGroup,
+} from "@chakra-ui/react"
+
+import React from 'react'
+import {motion} from 'framer-motion'
+
+const container = {
+ hidden: { opacity: 1, scale: 0 },
+ visible: {
+ opacity: 1,
+ scale: 1,
+ transition: {
+ delayChildren: 0.4,
+ staggerChildren: 0.3
+ }
+ }
+}
+
+const item = {
+ hidden: { y: 20, opacity: 0 },
+ visible: {
+ y: 0,
+ opacity: 1
+ }
+}
+
+const MotionStatGroup = motion(StatGroup)
+const MotionStat = motion(Stat)
+
+function StatCard() {
+ return (
+
+
+ User Growth
+ 77
+
+
+ 11.36%
+
+
+
+
+ Activity
+ 45 messages
+
+
+ 9.05%
+
+
+
+ )
+}
+
+export default StatCard
diff --git a/pages/controlpanel/commands.js b/pages/controlpanel/commands.js
index f838ee8..633c3f7 100644
--- a/pages/controlpanel/commands.js
+++ b/pages/controlpanel/commands.js
@@ -15,7 +15,7 @@ import { useSession } from 'next-auth/client'
import axios from 'axios'
-function Controller({initialState}) {
+function Controller({ initialState }) {
const [online, setOnline] = React.useState(initialState)
return (
@@ -35,10 +35,10 @@ function Commands() {
const [categories, setCategories] = React.useState(
[
- {command: 'Help', online: true},
- {command: 'Help', online: true},
- {command: 'Help', online: true},
- {command: 'Help', online: true},
+ { command: 'Help', online: true },
+ { command: 'Help', online: true },
+ { command: 'Help', online: true },
+ { command: 'Help', online: true },
]
)
@@ -51,35 +51,35 @@ function Commands() {
return (
<>
{session &&
- <>
-
- Cath Commands
-
-
- Command Controls
-
-
- | Command |
- Enabled |
-
-
-
- {categories.map((category, idx) => (
- <>
- {category.name}
- {category.commands.map((command, commandIdx)=> (
-
- | {command.name} |
-
-
- |
-
- ))}
-
- ))}
-
-
-
+ <>
+
+ Cath Commands
+
+
+ Command Controls
+
+
+ | Command |
+ Enabled |
+
+
+
+ {categories.map((category, idx) => (
+ <>
+ {category.name}
+ {category.commands.map((command, commandIdx) => (
+
+ | {command.name} |
+
+
+ |
+
+ ))}
+
+ ))}
+
+
+
} {!session && <>
Seems like you're not logged in. Log in to get started!
@@ -88,4 +88,4 @@ function Commands() {
);
}
-export default Commands
+export default Commands
\ No newline at end of file
diff --git a/pages/index.js b/pages/index.js
index 6dfa3c3..de75526 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -6,6 +6,7 @@ import { CTA } from '../components/CTA'
import { Features } from '../components/Features/Features'
import { Footer } from '../components/Footer/Footer'
import { motion } from 'framer-motion'
+import StatCard from '../components/StatCard'
export default function Home() {
@@ -21,13 +22,6 @@ export default function Home() {
}
}
- const item = {
- hidden: { y: 20, opacity: 0 },
- visible: {
- y: 0,
- opacity: 1
- }
- }
const [session, loading] = useSession()
@@ -44,12 +38,13 @@ export default function Home() {
{session && <>
Welcome {session.user.name}!
-
-
-
-
-
-
+
+
+
+
+
+
+
}