Update auth layout on console and compliance page to remove right panel

Signed-off-by: Émile Ré <emile@getprobo.com>

apps/trust/src/pages/auth/AuthLayout.tsx

@@ -1,5 +1,5 @@
 import { useSystemTheme } from "@probo/hooks";
-import { Logo } from "@probo/ui";
+import { Card, Logo } from "@probo/ui";
 import { type PreloadedQuery, usePreloadedQuery } from "react-relay";
 import { Outlet } from "react-router";
 import { graphql } from "relay-runtime";
@@ -26,25 +26,19 @@ export function AuthLayout(props: { queryRef: PreloadedQuery<AuthLayoutQuery> })
     : compliancePage.logoFileUrl;
 
   return (
-    <div className="grid grid-cols-1 lg:grid-cols-2 min-h-screen text-txt-primary">
-      <div className="bg-level-0 flex flex-col items-center justify-center">
-        <div className="w-full max-w-md px-6">
-          <Outlet />
-        </div>
-      </div>
-      <div className="hidden lg:flex bg-dialog font-bold flex-col items-center justify-center p-8 text-txt-primary lg:p-10">
-        <div className="flex flex-col items-center justify-center gap-4">
-          {logoFileUrl
-            ? (
-                <img
-                  alt=""
-                  src={logoFileUrl}
-                  className="size-[440px] rounded-2xl"
-                />
-              )
-            : <Logo withPicto className="w-[440px]" />}
-        </div>
-      </div>
+    <div className="min-h-screen text-txt-primary bg-level-0 flex flex-col items-center justify-center">
+      <Card className="w-full max-w-lg px-12 py-8 flex flex-col items-center justify-center gap-8">
+        {logoFileUrl
+          ? (
+              <img
+                alt=""
+                src={logoFileUrl}
+                className="h-20 rounded-2xl"
+              />
+            )
+          : <Logo withPicto className="w-[440px]" />}
+        <Outlet />
+      </Card>
     </div>
   );
 }

apps/trust/src/pages/auth/ConnectPage.tsx

@@ -128,7 +128,7 @@ export function ConnectPage(props: {
     <div className="space-y-6 w-full max-w-md mx-auto">
       <div className="space-y-2 text-center">
         <h1 className="text-3xl font-bold">
-          {__(`Connect to ${organization.name}'s compliance page`)}
+          {__("Connect to Compliance Page")}
         </h1>
         <p className="text-txt-tertiary">
           {__(
@@ -137,7 +137,7 @@ export function ConnectPage(props: {
         </p>
       </div>
 
-      <form onSubmit={e => void handleSubmit(e)} className="space-y-4">
+      <form onSubmit={e => void handleSubmit(e)} className="space-y-6">
         <Field
           label={__("Email")}
           placeholder="john.doe@acme.com"
@@ -156,7 +156,7 @@ export function ConnectPage(props: {
 
         <Button
           type="submit"
-          className="w-full"
+          className="w-xs h-10 mx-auto"
           disabled={formState.isSubmitting || (magicLinkSent && timer !== 0)}
         >
           {magicLinkSent

apps/trust/src/pages/auth/VerifyMagicLinkPage.tsx

@@ -94,7 +94,7 @@ export default function VerifyMagicLinkPagePageMutation() {
         </p>
       </div>
 
-      <form onSubmit={e => void handleSubmit(e)} className="space-y-4">
+      <form onSubmit={e => void handleSubmit(e)} className="space-y-6">
         <Field
           label={__("Confirmation Token")}
           type="text"
@@ -109,7 +109,7 @@ export default function VerifyMagicLinkPagePageMutation() {
 
         <Button
           type="submit"
-          className="w-full"
+          className="w-xs h-10 mx-auto"
           disabled={form.formState.isSubmitting}
         >
           {form.formState.isSubmitting