function MainComponent() { const [username, setUsername] = React.useState(''); const [password, setPassword] = React.useState(''); return /*#__PURE__*/ React.createElement("div", { className: "font-roboto bg-[#121212] text-white h-screen flex flex-col p-6", __source: { fileName: "", lineNumber: 6, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center mb-8", __source: { fileName: "", lineNumber: 7, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-chevron-left text-[#9ACD32] mr-4", __source: { fileName: "", lineNumber: 8, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("h1", { className: "text-[#9ACD32] text-xl font-semibold", __source: { fileName: "", lineNumber: 9, columnNumber: 9 }, __self: this }, "Log In")), /*#__PURE__*/ React.createElement("div", { className: "flex-grow flex flex-col justify-center", __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-2", __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }, "Welcome"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 mb-8", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."), /*#__PURE__*/ React.createElement("div", { className: "bg-[#8A2BE2] rounded-lg p-6 mb-8", __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 19, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm mb-1", __source: { fileName: "", lineNumber: 20, columnNumber: 13 }, __self: this }, "Username or email"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "username", className: "w-full bg-white text-black rounded px-3 py-2", placeholder: "example@example.com", value: username, onChange: (e)=>setUsername(e.target.value), __source: { fileName: "", lineNumber: 21, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-2", __source: { fileName: "", lineNumber: 30, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm mb-1", __source: { fileName: "", lineNumber: 31, columnNumber: 13 }, __self: this }, "Password"), /*#__PURE__*/ React.createElement("input", { type: "password", name: "password", className: "w-full bg-white text-black rounded px-3 py-2", placeholder: "••••••••••••", value: password, onChange: (e)=>setPassword(e.target.value), __source: { fileName: "", lineNumber: 32, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "text-right", __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-sm", __source: { fileName: "", lineNumber: 42, columnNumber: 13 }, __self: this }, "Forgot Password?"))), /*#__PURE__*/ React.createElement("button", { className: "bg-[#4A4A4A] text-white font-semibold py-3 rounded-full mb-6", __source: { fileName: "", lineNumber: 46, columnNumber: 9 }, __self: this }, "Log In"), /*#__PURE__*/ React.createElement("div", { className: "text-center mb-6", __source: { fileName: "", lineNumber: 50, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-gray-400 mb-4", __source: { fileName: "", lineNumber: 51, columnNumber: 11 }, __self: this }, "or sign up with"), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center space-x-4", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-white text-black w-10 h-10 rounded-full flex items-center justify-center", __source: { fileName: "", lineNumber: 53, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-google", __source: { fileName: "", lineNumber: 54, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: "bg-white text-black w-10 h-10 rounded-full flex items-center justify-center", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-facebook-f", __source: { fileName: "", lineNumber: 57, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: "bg-white text-black w-10 h-10 rounded-full flex items-center justify-center", __source: { fileName: "", lineNumber: 59, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-fingerprint", __source: { fileName: "", lineNumber: 60, columnNumber: 15 }, __self: this })))), /*#__PURE__*/ React.createElement("p", { className: "text-center text-gray-400", __source: { fileName: "", lineNumber: 65, columnNumber: 9 }, __self: this }, "Don't have an account? ", /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-[#9ACD32]", __source: { fileName: "", lineNumber: 66, columnNumber: 34 }, __self: this }, "Sign Up")))); }