login page fixed

This commit is contained in:
akash.dutta 2022-05-09 15:46:42 +05:30
parent a7fa988bf0
commit de44c40de5

View File

@ -1,30 +1,16 @@
import { Box, Flex, Image, Text, Spinner, useMediaQuery, } from '@chakra-ui/react';
import { Box, Flex, Image, Text, Spinner, useMediaQuery } from '@chakra-ui/react';
import React from 'react';
import { useQuery } from 'urql';
import { MetaQuery } from '../graphql/queries';
export function AuthLayout({ children }: { children: React.ReactNode }) {
const [{ fetching, data }] = useQuery({ query: MetaQuery });
const [isNotSmallerScreen] = useMediaQuery("(min-width:600px)");
const [isNotSmallerScreen] = useMediaQuery('(min-width:600px)');
return (
<Flex
flexWrap="wrap"
h="100%"
bg="gray.100"
alignItems="center"
justifyContent="center"
flexDirection="column"
>
<Flex alignItems="center">
<Image
src="https://authorizer.dev/images/logo.png"
alt="logo"
height="50"
/>
<Text
fontSize={isNotSmallerScreen ? "x-large" : "large"}
ml="3"
letterSpacing="3">
<Flex flexWrap='wrap' h='100vh' bg='gray.100' alignItems='center' justifyContent='center' flexDirection='column'>
<Flex alignItems='center'>
<Image src='https://authorizer.dev/images/logo.png' alt='logo' height='50' />
<Text fontSize='x-large' ml='3' letterSpacing='3'>
AUTHORIZER
</Text>
</Flex>
@ -33,17 +19,10 @@ export function AuthLayout({ children }: { children: React.ReactNode }) {
<Spinner />
) : (
<>
<Box
p="6"
m="5"
rounded="5"
bg="white"
w={isNotSmallerScreen ? "450px" : "400px"}
shadow="xl"
>
<Box p='6' m='5' rounded='5' bg='white' w={isNotSmallerScreen ? '500px' : '450px'} shadow='xl'>
{children}
</Box>
<Text color="gray.600" fontSize="sm">
<Text color='gray.600' fontSize='sm'>
Current Version: {data.meta.version}
</Text>
</>