flora is a fast and secure runtime that lets you write discord bots for your servers, with a rich TypeScript SDK, without worrying about running infrastructure. [mirror]
1
fork

Configure Feed

Select the types of activity you want to include in your feed.

feat: redesign login page with fullscreen cover image

Session-Id: b3dbcd25-5018-4175-b4c1-9e2b62517abd

+16 -15
apps/frontend/public/login.jpg

This is a binary file and will not be displayed.

apps/frontend/public/login.png

This is a binary file and will not be displayed.

+16 -15
apps/frontend/src/components/login-page.tsx
··· 42 42 path='/login' 43 43 noindex 44 44 /> 45 - <div className='flex min-h-svh flex-col items-center justify-center bg-muted p-6 md:p-10'> 46 - <div className='w-full max-w-sm md:max-w-4xl'> 47 - <LoginForm /> 45 + <div className='relative min-h-svh overflow-hidden'> 46 + <img 47 + src='/login.png' 48 + alt='Login background artwork' 49 + className='absolute inset-0 h-full w-full object-cover' 50 + /> 51 + <div className='absolute inset-0 bg-black/40' /> 52 + <div className='relative flex min-h-svh items-center justify-center p-6 md:p-10'> 53 + <div className='w-full max-w-sm'> 54 + <LoginForm /> 55 + </div> 48 56 </div> 49 57 </div> 50 58 </> ··· 59 67 60 68 return ( 61 69 <div className={cn('flex flex-col gap-6', className)} {...props}> 62 - <Card className='overflow-hidden p-0'> 63 - <CardContent className='grid p-0 md:grid-cols-2'> 64 - <form className='p-6 md:p-8'> 70 + <Card className='border-white/20 bg-background/90 shadow-xl backdrop-blur supports-[backdrop-filter]:bg-background/80'> 71 + <CardContent className='p-6 md:p-8'> 72 + <form> 65 73 <FieldGroup> 66 74 <div className='flex flex-col items-center gap-2 text-center'> 67 75 <h1 className='text-2xl font-bold'>Welcome back</h1> ··· 73 81 <Button 74 82 type='button' 75 83 variant='outline' 76 - className='w-full max-w-xs' 84 + className='w-full' 77 85 onClick={redirectToLogin} 78 86 > 79 87 <svg ··· 89 97 </div> 90 98 </FieldGroup> 91 99 </form> 92 - <div className='hidden bg-muted md:block'> 93 - <img 94 - src='/login.jpg' 95 - alt='Login artwork' 96 - className='block h-auto w-full' 97 - /> 98 - </div> 99 100 </CardContent> 100 101 </Card> 101 - <FieldDescription className='px-6 text-center'> 102 + <FieldDescription className='px-6 text-center text-white/90 [&_a]:underline [&_a]:underline-offset-2'> 102 103 By clicking continue, you agree to our <a href='/terms-of-service'>Terms of Service</a> and 103 104 {' '} 104 105 <a href='/privacy-policy'>Privacy Policy</a>.