update pay function

src/views/AgentChat/neuratalk/components/LayoutLogin/index.tsx

@@ -0,0 +1,87 @@
+import Link from "next/link";
+import Image from "@/components/Image";
+import Button from "@/components/Button";
+import Icon from "@/components/Icon";
+import Slider from "./Slider";
+
+type Props = {
+    children: React.ReactNode;
+    title: string;
+    description: React.ReactNode;
+};
+
+const LayoutLogin = ({ title, description, children }: Props) => (
+    <div className="p-5">
+        <div className="flex min-h-[calc(100svh-2.5rem)]">
+            <div className="relative w-1/2 text-static-white overflow-hidden max-lg:hidden">
+                <Image
+                    className="object-cover rounded-3xl"
+                    src="/images/auth-pic.jpg"
+                    fill
+                    sizes="(max-width: 1023px) 100vw, 50vw"
+                    alt=""
+                />
+                <div className="absolute top-19 left-10 right-10 max-2xl:top-8 max-2xl:left-8 max-2xl:right-8">
+                    <div className="mb-4 text-h1 max-2xl:text-h3">
+                        AI Generative Anything you can imagine
+                    </div>
+                    <div className="text-p-lg max-2xl:text-p-md">
+                        Generate your ideas in to reality fast & quick !
+                    </div>
+                </div>
+                <Slider />
+            </div>
+            <div className="flex flex-col w-1/2 pl-12 max-lg:w-full max-lg:pl-0">
+                <div className="flex justify-between items-center mb-auto">
+                    <div className="">
+                        <div className="text-[1.125rem] font-bold">Website</div>
+                        <div className="-mt-1 text-soft-400">
+                            Visite Our website
+                        </div>
+                    </div>
+                    <Button
+                        className="!h-10 !gap-3 bg-white-0 rounded-xl"
+                        isStroke
+                    >
+                        LoopiBot.com
+                        <Icon className="!size-4.5" name="chevron-circle" />
+                    </Button>
+                </div>
+                <div className="w-full max-w-89 mx-auto my-6">
+                    <div className="mb-7 text-center max-md:mb-4">
+                        <Link className="inline-flex mb-6 max-md:mb-4" href="/">
+                            <Image
+                                className="w-18 opacity-100 max-md:w-14"
+                                src="/images/logo-auth.svg"
+                                width={68}
+                                height={68}
+                                alt=""
+                            />
+                        </Link>
+                        <div className="text-h3 max-md:text-[1.6rem]">
+                            {title}
+                        </div>
+                        <div className="mt-1.5 text-h6 max-md:text-label-md">
+                            {description}
+                        </div>
+                    </div>
+                    {children}
+                </div>
+                <div className="flex justify-between items-center h-15 mt-auto max-2xl:h-auto">
+                    <div className="text-label-sm text-sub-600">
+                        ©LoopiBot.io
+                    </div>
+                    <button className="group flex items-center gap-2 text-label-sm text-sub-600 transition-colors hover:text-strong-950">
+                        <Icon
+                            className="!size-4.5 fill-sub-600 transition-colors group-hover:fill-strong-950"
+                            name="envelope"
+                        />
+                        LoopiBot@chat.io
+                    </button>
+                </div>
+            </div>
+        </div>
+    </div>
+);
+
+export default LayoutLogin;