Tweaked layout.
This commit is contained in:
@@ -11,11 +11,8 @@ const CommandResponsesChart = ({
|
|||||||
lineChartData
|
lineChartData
|
||||||
}: CommandResponsesChartProps): JSX.Element => {
|
}: CommandResponsesChartProps): JSX.Element => {
|
||||||
return (
|
return (
|
||||||
<VStack gap={4} w="100%">
|
<VStack gap={6} w="100%">
|
||||||
<Heading
|
<Heading as="h4" fontSize="2xl">{`Commands Responded To`}</Heading>
|
||||||
as="h4"
|
|
||||||
fontSize="2xl"
|
|
||||||
>{`Commands Responded To (Past 30 Days)`}</Heading>
|
|
||||||
<LineChartComponent data={lineChartData} label="Command Responses" />
|
<LineChartComponent data={lineChartData} label="Command Responses" />
|
||||||
</VStack>
|
</VStack>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -11,8 +11,8 @@ const LinksDeletedChart = ({
|
|||||||
lineChartData
|
lineChartData
|
||||||
}: LinksDeletedChartProps): JSX.Element => {
|
}: LinksDeletedChartProps): JSX.Element => {
|
||||||
return (
|
return (
|
||||||
<VStack gap={4} w="100%">
|
<VStack gap={6} w="100%">
|
||||||
<Heading as="h4" fontSize="2xl">{`Links Deleted (Past 30 Days)`}</Heading>
|
<Heading as="h4" fontSize="2xl">{`Links Deleted`}</Heading>
|
||||||
<LineChartComponent data={lineChartData} label="Links Deleted" />
|
<LineChartComponent data={lineChartData} label="Links Deleted" />
|
||||||
</VStack>
|
</VStack>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { JSX } from "react";
|
import { JSX } from "react";
|
||||||
import { Heading, Flex, VStack } from "@chakra-ui/react";
|
import { Heading, Flex, Text, VStack } from "@chakra-ui/react";
|
||||||
import { CombinedError } from "urql";
|
import { CombinedError } from "urql";
|
||||||
import SingleStatComponent from "@/components/stats/SingleStat";
|
import SingleStatComponent from "@/components/stats/SingleStat";
|
||||||
|
|
||||||
@@ -24,9 +24,14 @@ const StatsList = ({
|
|||||||
}: StatsListProps): JSX.Element => {
|
}: StatsListProps): JSX.Element => {
|
||||||
return (
|
return (
|
||||||
<VStack gap={6} w="100%">
|
<VStack gap={6} w="100%">
|
||||||
<Heading as="h3" fontSize="3xl">
|
<VStack gap={1}>
|
||||||
{title}
|
<Heading as="h3" fontSize="3xl">
|
||||||
</Heading>
|
{title}
|
||||||
|
</Heading>
|
||||||
|
<Text textAlign="center" fontSize="sm" color="whiteAlpha.800">
|
||||||
|
{groups ? "Updates every 24 hours" : "At time of page load"}
|
||||||
|
</Text>
|
||||||
|
</VStack>
|
||||||
<Flex w="80%" flexDirection={{ base: "column", md: "row" }} gap={4}>
|
<Flex w="80%" flexDirection={{ base: "column", md: "row" }} gap={4}>
|
||||||
{groups ? (
|
{groups ? (
|
||||||
<SingleStatComponent
|
<SingleStatComponent
|
||||||
|
|||||||
@@ -11,11 +11,8 @@ const TimedTriggeredChart = ({
|
|||||||
lineChartData
|
lineChartData
|
||||||
}: TimedTriggeredChartProps): JSX.Element => {
|
}: TimedTriggeredChartProps): JSX.Element => {
|
||||||
return (
|
return (
|
||||||
<VStack gap={4} w="100%">
|
<VStack gap={6} w="100%">
|
||||||
<Heading
|
<Heading as="h4" fontSize="2xl">{`Times Bot Was Triggered`}</Heading>
|
||||||
as="h4"
|
|
||||||
fontSize="2xl"
|
|
||||||
>{`Times Bot Was Triggered (Past 30 Days)`}</Heading>
|
|
||||||
<LineChartComponent data={lineChartData} label="Times Triggered" />
|
<LineChartComponent data={lineChartData} label="Times Triggered" />
|
||||||
</VStack>
|
</VStack>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -104,7 +104,7 @@ export default function Home() {
|
|||||||
py="5vh"
|
py="5vh"
|
||||||
minW="fit-content"
|
minW="fit-content"
|
||||||
>
|
>
|
||||||
<VStack w={{ base: "100%", md: "90%" }} gap={6} minW="fit-content">
|
<VStack w={{ base: "100%", md: "90%" }} gap={10} minW="fit-content">
|
||||||
<VStack w="80%" gap={10}>
|
<VStack w="80%" gap={10}>
|
||||||
<Icon h="7.5rem" color="whiteAlpha">
|
<Icon h="7.5rem" color="whiteAlpha">
|
||||||
<svg
|
<svg
|
||||||
@@ -171,7 +171,12 @@ export default function Home() {
|
|||||||
/>
|
/>
|
||||||
</VStack>
|
</VStack>
|
||||||
<VStack w="95%" gap="5vh">
|
<VStack w="95%" gap="5vh">
|
||||||
<Heading as="h1" fontSize="3xl">{`30 Day Stats`}</Heading>
|
<VStack gap={1}>
|
||||||
|
<Heading as="h1" fontSize="3xl">{`30 Day Stats`}</Heading>
|
||||||
|
<Text textAlign="center" fontSize="sm" color="whiteAlpha.800">
|
||||||
|
{"Updates every 24 hours"}
|
||||||
|
</Text>
|
||||||
|
</VStack>
|
||||||
<Skeleton w="100%" h="auto" loading={thirtyDayStatsFetching}>
|
<Skeleton w="100%" h="auto" loading={thirtyDayStatsFetching}>
|
||||||
<LinksDeletedChart lineChartData={lineChartArrState} />
|
<LinksDeletedChart lineChartData={lineChartArrState} />
|
||||||
</Skeleton>
|
</Skeleton>
|
||||||
|
|||||||
Reference in New Issue
Block a user