Layout improvements for auth pages

packages/web/components/elements/StyledText.tsx

@@ -4,7 +4,7 @@ const textVariants = {
   style: {
     body: {
       fontSize: '$2',
-      lineHeight: '1.25',
+      lineHeight: '1.50',
     },
     logoTitle: {
       fontFamily: 'Inter',

packages/web/components/templates/auth/EmailForgotPassword.tsx

@@ -40,9 +40,8 @@ const ForgotPasswordForm = (): JSX.Element => {
 export function EmailForgotPassword(): JSX.Element {
   const router = useRouter()
   const [email, setEmail] = useState<string>('')
-  const [errorMessage, setErrorMessage] = useState<string | undefined>(
-    undefined
-  )
+  const [errorMessage, setErrorMessage] =
+    useState<string | undefined>(undefined)
   const recaptchaTokenRef = useRef<HTMLInputElement>(null)
 
   useEffect(() => {
@@ -59,7 +58,7 @@ export function EmailForgotPassword(): JSX.Element {
       <VStack
         alignment="center"
         css={{
-          padding: '16px',
+          padding: '20px',
           minWidth: '340px',
           width: '70vw',
           maxWidth: '576px',

packages/web/components/templates/auth/EmailLogin.tsx

@@ -52,9 +52,8 @@ const LoginForm = (): JSX.Element => {
 
 export function EmailLogin(): JSX.Element {
   const router = useRouter()
-  const [errorMessage, setErrorMessage] = useState<string | undefined>(
-    undefined
-  )
+  const [errorMessage, setErrorMessage] =
+    useState<string | undefined>(undefined)
   const recaptchaTokenRef = useRef<HTMLInputElement>(null)
 
   useEffect(() => {
@@ -71,7 +70,7 @@ export function EmailLogin(): JSX.Element {
       <VStack
         alignment="center"
         css={{
-          padding: '16px',
+          padding: '20px',
           minWidth: '340px',
           width: '70vw',
           maxWidth: '576px',

packages/web/components/templates/auth/EmailSignup.tsx

@@ -150,7 +150,7 @@ export function EmailSignup(): JSX.Element {
         <VStack
           alignment="center"
           css={{
-            padding: '16px',
+            padding: '20px',
             minWidth: '340px',
             width: '70vw',
             maxWidth: '576px',