Disroot/Mangane
5
0
Fork 0
Code Issues Pull requests Projects Releases 2 Packages Wiki Activity

Fix unauth page layout

Browse source
This commit is contained in:
Justin 2022-05-09 08:27:26 -04:00
parent 3b920e25c3
commit 25477443ef
3 changed files with 36 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/index.ejs
View file

@ -12,7 +12,7 @@
<%= snippets %>
</head>
<body class="theme-mode-light no-reduce-motion">
<div id="soapbox">
<div id="soapbox" class="h-full">
<div class="loading-indicator-wrapper">
<div class="loading-indicator">
<div class="loading-indicator__container">

4
app/soapbox/containers/soapbox.tsx
View file

@ -132,7 +132,7 @@ const SoapboxMount = () => {
const waitlisted = account && !account.source.get('approved', true);
const bodyClass = classNames('bg-white dark:bg-slate-900 text-base', {
const bodyClass = classNames('bg-white dark:bg-slate-900 text-base h-full', {
'no-reduce-motion': !settings.get('reduceMotion'),
'underline-links': settings.get('underlineLinks'),
'dyslexic': settings.get('dyslexicFont'),
@ -162,7 +162,7 @@ const SoapboxMount = () => {
return (
<IntlProvider locale={locale} messages={messages}>
<Helmet>
<html lang={locale} className={classNames({ dark: darkMode })} />
<html lang={locale} className={classNames('h-full', { dark: darkMode })} />
<body className={bodyClass} />
{themeCss && <style id='theme' type='text/css'>{`:root{${themeCss}}`}</style>}
<meta name='theme-color' content={soapboxConfig.brandColor} />

65
app/soapbox/features/auth_layout/index.tsx
View file

@ -20,44 +20,45 @@ const AuthLayout = () => {
const siteTitle = useAppSelector(state => state.instance.title);
return (
<div>
<div className='h-full'>
<LandingGradient />
<main className='relative flex flex-col h-screen'>
<header className='py-10 flex justify-center relative'>
<Link to='/' className='cursor-pointer'>
{logo ? (
<img src={logo} alt={siteTitle} className='h-7' />
) : (
<SvgIcon
className='w-7 h-7 dark:text-white'
alt={siteTitle}
src={require('@tabler/icons/icons/home.svg')}
/>
)}
</Link>
</header>
<main className='relative min-h-full sm:flex sm:items-center sm:justify-center py-12'>
<div className='w-full sm:max-w-lg md:max-w-2xl space-y-8'>
<header className='flex justify-center relative'>
<Link to='/' className='cursor-pointer'>
{logo ? (
<img src={logo} alt={siteTitle} className='h-7' />
) : (
<SvgIcon
className='w-7 h-7 dark:text-white'
alt={siteTitle}
src={require('@tabler/icons/icons/home.svg')}
/>
)}
</Link>
</header>
<div className='flex flex-col justify-center items-center'>
<div className='pb-10 sm:mx-auto w-full sm:max-w-lg md:max-w-2xl'>
<Card variant='rounded' size='xl'>
<CardBody>
<Switch>
<Route exact path='/verify' component={Verification} />
<Route exact path='/verify/email/:token' component={EmailPassthru} />
<Route exact path='/login' component={LoginPage} />
<Route exact path='/signup' component={RegistrationForm} />
<Route exact path='/reset-password' component={PasswordReset} />
<Route exact path='/edit-password' component={PasswordResetConfirm} />
<div className='flex flex-col justify-center items-center'>
<div className='sm:mx-auto w-full sm:max-w-lg md:max-w-2xl'>
<Card variant='rounded' size='xl'>
<CardBody>
<Switch>
<Route exact path='/verify' component={Verification} />
<Route exact path='/verify/email/:token' component={EmailPassthru} />
<Route exact path='/login' component={LoginPage} />
<Route exact path='/signup' component={RegistrationForm} />
<Route exact path='/reset-password' component={PasswordReset} />
<Route exact path='/edit-password' component={PasswordResetConfirm} />
<Redirect from='/auth/password/new' to='/reset-password' />
<Redirect from='/auth/password/edit' to='/edit-password' />
</Switch>
</CardBody>
</Card>
<Redirect from='/auth/password/new' to='/reset-password' />
<Redirect from='/auth/password/edit' to='/edit-password' />
</Switch>
</CardBody>
</Card>
</div>
</div>
</div>
</main>
<BundleContainer fetchComponent={NotificationsContainer}>