Break out LandingGradient into its own component

app/soapbox/components/landing-gradient.tsx

@@ -0,0 +1,8 @@
+import React from 'react';
+
+/** Fullscreen gradient used as a backdrop to public pages. */
+const LandingGradient: React.FC = () => (
+  <div className='fixed h-screen w-full bg-gradient-to-tr from-primary-50 dark:from-slate-700 via-white dark:via-slate-900 to-gradient-end/10 dark:to-slate-900' />
+);
+
+export default LandingGradient;

app/soapbox/features/auth_layout/index.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { Link, Redirect, Route, Switch } from 'react-router-dom';
 
+import LandingGradient from 'soapbox/components/landing-gradient';
 import SvgIcon from 'soapbox/components/ui/icon/svg-icon';
 import BundleContainer from 'soapbox/features/ui/containers/bundle_container';
 import { NotificationsContainer } from 'soapbox/features/ui/util/async-components';
@@ -20,7 +21,7 @@ const AuthLayout = () => {
 
   return (
     <div>
-      <div className='fixed h-screen w-full bg-gradient-to-tr from-primary-50 dark:from-slate-700 via-white dark:via-slate-900 to-cyan-50 dark:to-cyan-900' />
+      <LandingGradient />
 
       <main className='relative flex flex-col h-screen'>
         <header className='py-10 flex justify-center relative'>

app/soapbox/features/onboarding/onboarding-wizard.tsx

@@ -4,6 +4,7 @@ import { useDispatch } from 'react-redux';
 import ReactSwipeableViews from 'react-swipeable-views';
 
 import { endOnboarding } from 'soapbox/actions/onboarding';
+import LandingGradient from 'soapbox/components/landing-gradient';
 import { HStack } from 'soapbox/components/ui';
 
 import AvatarSelectionStep from './steps/avatar-selection-step';
@@ -68,7 +69,7 @@ const OnboardingWizard = () => {
 
   return (
     <div data-testid='onboarding-wizard'>
-      <div className='fixed h-screen w-full bg-gradient-to-tr from-primary-50 dark:from-slate-700 via-white dark:via-slate-900 to-cyan-50 dark:to-cyan-900' />
+      <LandingGradient />
 
       <main className='h-screen flex flex-col overflow-x-hidden'>
         <div className='flex flex-col justify-center items-center h-full'>