63 lines
1.4 KiB
TypeScript
63 lines
1.4 KiB
TypeScript
import { Col, Container, createStyles, Grid, Paper, Text } from "@mantine/core";
|
|
import Link from "next/link";
|
|
import { TbSettings, TbUsers } from "react-icons/tb";
|
|
|
|
const managementOptions = [
|
|
{
|
|
title: "User management",
|
|
icon: TbUsers,
|
|
route: "/admin/users",
|
|
},
|
|
{
|
|
title: "Configuration",
|
|
icon: TbSettings,
|
|
route: "/admin/config",
|
|
},
|
|
];
|
|
|
|
const useStyles = createStyles((theme) => ({
|
|
item: {
|
|
display: "flex",
|
|
flexDirection: "column",
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
textAlign: "center",
|
|
height: 90,
|
|
"&:hover": {
|
|
boxShadow: `${theme.shadows.sm} !important`,
|
|
transform: "scale(1.01)",
|
|
},
|
|
},
|
|
}));
|
|
|
|
const Admin = () => {
|
|
const { classes, theme } = useStyles();
|
|
|
|
return (
|
|
<Container size="xl">
|
|
<Paper withBorder radius="md" p={40}>
|
|
<Grid mt="md">
|
|
{managementOptions.map((item) => {
|
|
return (
|
|
<Col xs={6} key={item.route}>
|
|
<Paper
|
|
withBorder
|
|
component={Link}
|
|
href={item.route}
|
|
key={item.title}
|
|
className={classes.item}
|
|
>
|
|
<item.icon color={theme.colors.victoria[5]} size={35} />
|
|
<Text mt={7}>{item.title}</Text>
|
|
</Paper>
|
|
</Col>
|
|
);
|
|
})}
|
|
</Grid>
|
|
</Paper>
|
|
</Container>
|
|
);
|
|
};
|
|
|
|
export default Admin;
|