function MainComponent() { const [formData, setFormData] = React.useState({ major: '', age: '', income: '', photo: null }); const handleChange = (e)=>{ const { name, value, files } = e.target; setFormData((prevFormData)=>({ ...prevFormData, [name]: files ? files[0] : value })); }; const handleSubmit = (e)=>{ e.preventDefault(); }; const backgroundPhotoUrl = 'images/lebanese-university-bg.jpg'; const logoPhotoUrl = formData.photo ? URL.createObjectURL(formData.photo) : 'images/lebanese-university-logo.png'; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#F8FAFC] flex items-center justify-center", style: { backgroundImage: `url(${backgroundPhotoUrl})`, backgroundSize: 'cover', backgroundPosition: 'center' }, __source: { fileName: "", lineNumber: 25, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-lg p-8 bg-white shadow-md rounded-lg backdrop-blur-sm bg-opacity-90", __source: { fileName: "", lineNumber: 26, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/9512512e-6d76-4cf2-ae37-e33dddc00b40/", alt: "Lebanese University logo", className: "w-32 h-32 rounded-full mx-auto mb-4", __source: { fileName: "", lineNumber: 27, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("h1", { className: "font-roboto text-4xl text-[#121212] mb-4 text-center", __source: { fileName: "", lineNumber: 28, columnNumber: 9 }, __self: this }, "Lebanese University"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-xl text-[#121212] mb-8 text-center", __source: { fileName: "", lineNumber: 29, columnNumber: 9 }, __self: this }, "Enter your information to sign up."), /*#__PURE__*/ React.createElement("form", { className: "space-y-6", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 30, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 31, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "major", className: "font-roboto text-lg text-[#121212] block", __source: { fileName: "", lineNumber: 32, columnNumber: 13 }, __self: this }, "Major"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "major", name: "major", value: formData.major, onChange: handleChange, className: "w-full p-2 border border-gray-300 rounded-md mt-1 font-roboto", __source: { fileName: "", lineNumber: 33, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 35, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "age", className: "font-roboto text-lg text-[#121212] block", __source: { fileName: "", lineNumber: 36, columnNumber: 13 }, __self: this }, "Age"), /*#__PURE__*/ React.createElement("input", { type: "number", id: "age", name: "age", value: formData.age, onChange: handleChange, className: "w-full p-2 border border-gray-300 rounded-md mt-1 font-roboto", __source: { fileName: "", lineNumber: 37, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 39, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "income", className: "font-roboto text-lg text-[#121212] block", __source: { fileName: "", lineNumber: 40, columnNumber: 13 }, __self: this }, "Monthly Income"), /*#__PURE__*/ React.createElement("input", { type: "number", id: "income", name: "income", value: formData.income, onChange: handleChange, className: "w-full p-2 border border-gray-300 rounded-md mt-1 font-roboto", __source: { fileName: "", lineNumber: 41, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 43, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "photo", className: "font-roboto text-lg text-[#121212] block", __source: { fileName: "", lineNumber: 44, columnNumber: 13 }, __self: this }, "Photo"), /*#__PURE__*/ React.createElement("input", { type: "file", id: "photo", name: "photo", onChange: handleChange, className: "w-full p-2 text-gray-600 file:border-0 file:bg-[#2563EB] file:text-white file:rounded-md file:px-4 file:py-2 file:hover:bg-[#1D4ED8] file:transition file:duration-300", __source: { fileName: "", lineNumber: 45, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full px-6 py-3 bg-[#2563EB] text-white font-roboto rounded-md hover:bg-[#1D4ED8] transition duration-300", __source: { fileName: "", lineNumber: 47, columnNumber: 11 }, __self: this }, "Sign Up")))); }