function MobileAccountCreation({ logoSrc, logoAlt, onSubmit }) { return /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/2 flex flex-col justify-between p-8", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-center mb-8", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { alt: logoAlt, src: logoSrc, className: "w-24 h-24", __source: { fileName: "", lineNumber: 6, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("h2", { className: "text-[#F3E3AC] font-open-sans text-center text-lg mb-8", __source: { fileName: "", lineNumber: 8, columnNumber: 9 }, __self: this }, "Create your account"), /*#__PURE__*/ React.createElement("form", { className: "space-y-6", onSubmit: onSubmit, __source: { fileName: "", lineNumber: 9, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "fullName", placeholder: "Full Name", className: "w-full border-b border-[#F3E3AC] bg-transparent text-[#F3E3AC] placeholder-[#726950] focus:outline-none py-2 font-open-sans", __source: { fileName: "", lineNumber: 11, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 18, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", placeholder: "Email", className: "w-full border-b border-[#F3E3AC] bg-transparent text-[#F3E3AC] placeholder-[#726950] focus:outline-none py-2 font-open-sans", __source: { fileName: "", lineNumber: 19, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 26, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "password", name: "password", placeholder: "Password", className: "w-full border-b border-[#F3E3AC] bg-transparent text-[#F3E3AC] placeholder-[#726950] focus:outline-none py-2 font-open-sans", __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "password", name: "confirmPassword", placeholder: "Confirm Password", className: "w-full border-b border-[#F3E3AC] bg-transparent text-[#F3E3AC] placeholder-[#726950] focus:outline-none py-2 font-open-sans", __source: { fileName: "", lineNumber: 35, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full py-2 bg-[#F3E3AC] text-[#2E3521] hover:bg-[#FFFAE7] transition duration-200 ease-in-out", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }, "Create Account"))), /*#__PURE__*/ React.createElement("p", { className: "text-center text-[#726950] mt-8 font-open-sans", __source: { fileName: "", lineNumber: 50, columnNumber: 7 }, __self: this }, "By signing up, you agree to our Terms & Conditions and Privacy Policy.")); } function MobileAccountCreationStory() { const handleSubmit = (event)=>{ event.preventDefault(); // Handle form submission logic here }; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 64, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MobileAccountCreation, { logoSrc: "https://ucarecdn.com/d6d03ea5-17df-43ac-9026-8075af650e56/", logoAlt: "Medium logo", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 65, columnNumber: 7 }, __self: this })); } function MainComponent() { const handleSubmit = (event)=>{ event.preventDefault(); }; return /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center h-screen bg-[#1D2115]", __source: { fileName: "", lineNumber: 7, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-[800px] h-auto bg-[#2E3521] flex flex-col md:flex-row rounded-lg overflow-hidden", __source: { fileName: "", lineNumber: 8, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement(MobileAccountCreation, { logoSrc: "https://ucarecdn.com/d6d03ea5-17df-43ac-9026-8075af650e56/", logoAlt: "Medium logo", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 9, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/2 h-64 md:h-auto bg-cover bg-center", style: { backgroundImage: "url('https://images.pexels.com/photos/8973337/pexels-photo-8973337.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2')" }, __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }))); }