44 lines
936 B
TypeScript
44 lines
936 B
TypeScript
import { ReactNode } from 'react';
|
|
import { Box } from './Box';
|
|
import { Surface } from './Surface';
|
|
|
|
export interface ErrorPageContainerProps {
|
|
children: ReactNode;
|
|
size?: 'sm' | 'md' | 'lg';
|
|
variant?: 'default' | 'glass';
|
|
}
|
|
|
|
export const ErrorPageContainer = ({ children, size = 'md', variant = 'default' }: ErrorPageContainerProps) => {
|
|
const sizeMap = {
|
|
sm: '24rem',
|
|
md: '32rem',
|
|
lg: '42rem',
|
|
};
|
|
|
|
return (
|
|
<Box
|
|
minHeight="100vh"
|
|
display="flex"
|
|
alignItems="center"
|
|
justifyContent="center"
|
|
padding={4}
|
|
bg="var(--ui-color-bg-base)"
|
|
position="relative"
|
|
overflow="hidden"
|
|
>
|
|
<Surface
|
|
variant={variant}
|
|
rounded="xl"
|
|
padding={8}
|
|
maxWidth={sizeMap[size]}
|
|
width="100%"
|
|
border={true}
|
|
position="relative"
|
|
zIndex={10}
|
|
>
|
|
{children}
|
|
</Surface>
|
|
</Box>
|
|
);
|
|
};
|