bigbuffet/pleroma
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

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 %> <%= snippets %>
</head> </head>
<body class="theme-mode-light no-reduce-motion"> <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-wrapper">
<div class="loading-indicator"> <div class="loading-indicator">
<div class="loading-indicator__container"> <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 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'), 'no-reduce-motion': !settings.get('reduceMotion'),
'underline-links': settings.get('underlineLinks'), 'underline-links': settings.get('underlineLinks'),
'dyslexic': settings.get('dyslexicFont'), 'dyslexic': settings.get('dyslexicFont'),
@ -162,7 +162,7 @@ const SoapboxMount = () => {
return ( return (
<IntlProvider locale={locale} messages={messages}> <IntlProvider locale={locale} messages={messages}>
<Helmet> <Helmet>
<html lang={locale} className={classNames({ dark: darkMode })} /> <html lang={locale} className={classNames('h-full', { dark: darkMode })} />
<body className={bodyClass} /> <body className={bodyClass} />
{themeCss && <style id='theme' type='text/css'>{`:root{${themeCss}}`}</style>} {themeCss && <style id='theme' type='text/css'>{`:root{${themeCss}}`}</style>}
<meta name='theme-color' content={soapboxConfig.brandColor} /> <meta name='theme-color' content={soapboxConfig.brandColor} />

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

@ -20,11 +20,12 @@ const AuthLayout = () => {
const siteTitle = useAppSelector(state => state.instance.title); const siteTitle = useAppSelector(state => state.instance.title);
return ( return (
<div> <div className='h-full'>
<LandingGradient /> <LandingGradient />
<main className='relative flex flex-col h-screen'> <main className='relative min-h-full sm:flex sm:items-center sm:justify-center py-12'>
<header className='py-10 flex justify-center relative'> <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'> <Link to='/' className='cursor-pointer'>
{logo ? ( {logo ? (
<img src={logo} alt={siteTitle} className='h-7' /> <img src={logo} alt={siteTitle} className='h-7' />
@ -39,7 +40,7 @@ const AuthLayout = () => {
</header> </header>
<div className='flex flex-col justify-center items-center'> <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'> <div className='sm:mx-auto w-full sm:max-w-lg md:max-w-2xl'>
<Card variant='rounded' size='xl'> <Card variant='rounded' size='xl'>
<CardBody> <CardBody>
<Switch> <Switch>
@ -57,7 +58,7 @@ const AuthLayout = () => {
</Card> </Card>
</div> </div>
</div> </div>
</div>
</main> </main>
<BundleContainer fetchComponent={NotificationsContainer}> <BundleContainer fetchComponent={NotificationsContainer}>