
// pages/index
import { Row, Col } from "antd";
import Head from "next/head";
import FullWidthImage from "../components/pages/FullWidthImage";
import RenderProgress from "../components/pages/RenderProgress";
import useNumbers from "../hooks/useNumbers";
const Home = () => {
const { numbers } = useNumbers();
console.log("numbers in home", numbers);
return (
<>
<Head>
<title>Modern Content Management System - CMS</title>
<meta
name="description"
content="Read latest blog posts on various topics"
/>
</Head>
<div style={{ marginBottom: 50 }}></div>
<FullWidthImage />
<Row>
<Col
span={6}
style={{ marginTop: 100, textAlign: "center", fontSize: 20 }}
>
<RenderProgress number={numbers.posts} name="Posts" />
</Col>
<Col
span={6}
style={{ marginTop: 100, textAlign: "center", fontSize: 20 }}
>
<RenderProgress number={numbers.categories} name="Categories" />
</Col>
<Col
span={6}
style={{ marginTop: 100, textAlign: "center", fontSize: 20 }}
>
<RenderProgress number={numbers.comments} name="Comments" />
</Col>
<Col
span={6}
style={{ marginTop: 100, textAlign: "center", fontSize: 20 }}
>
<RenderProgress number={numbers.users} name="Users" />
</Col>
</Row>
</>
);
};
export default Home;