44 lines
1.0 KiB
TypeScript
44 lines
1.0 KiB
TypeScript
import React, { ReactNode, useEffect } from 'react';
|
|
|
|
import { Flex, FlexProps } from '@chakra-ui/react';
|
|
import { useLocation } from 'react-router-dom';
|
|
|
|
import { PageLayout } from '@/components/Layout/PageLayout';
|
|
import { colors } from '@/theme/foundations/colors';
|
|
import { useColorModeValue } from '@/components/ui/color-mode';
|
|
|
|
export type LayoutProps = FlexProps & {
|
|
children: ReactNode;
|
|
};
|
|
|
|
export const PageLayoutInfoCenter = ({
|
|
children,
|
|
width = '25%',
|
|
...rest
|
|
}: LayoutProps) => {
|
|
const { pathname } = useLocation();
|
|
|
|
useEffect(() => {
|
|
window.scrollTo(0, 0);
|
|
}, [pathname]);
|
|
|
|
return (
|
|
<PageLayout>
|
|
<Flex
|
|
direction="column"
|
|
margin="auto"
|
|
minWidth={width}
|
|
border="back.900"
|
|
borderWidth="1px"
|
|
borderRadius="8px"
|
|
padding="10px"
|
|
boxShadow={'0px 0px 16px ' + colors.back[900]}
|
|
backgroundColor={useColorModeValue('#FFFFFF', '#000000')}
|
|
{...rest}
|
|
>
|
|
{children}
|
|
</Flex>
|
|
</PageLayout>
|
|
);
|
|
};
|