function MainComponent() { const galleryItems = [ { id: 1, name: "NFT #1", price: "1-2", image: "/images/nft1.png", lastSale: "1-2" }, { id: 2, name: "NFT #2", price: "1-2", image: "/images/nft2.png", lastSale: "1-2" }, { id: 3, name: "NFT #3", price: "1-2", image: "/images/nft3.png", lastSale: "1-2" } ]; return /*#__PURE__*/ React.createElement("div", { className: "bg-gradient-to-r from-[#6d5b97] to-[#d390c8] min-h-screen font-montserrat", __source: { fileName: "", lineNumber: 8, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4 text-white", __source: { fileName: "", lineNumber: 9, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "flex flex-col sm:flex-row justify-between items-center border-b border-purple-300 py-4", __source: { fileName: "", lineNumber: 10, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center text-3xl font-extrabold text-[#e0aaff]", __source: { fileName: "", lineNumber: 11, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-dragon mr-3", "aria-hidden": "true", __source: { fileName: "", lineNumber: 12, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("h2", { __source: { fileName: "", lineNumber: 13, columnNumber: 13 }, __self: this }, "Dratini Marketplace Beta v1.0")), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-4 items-center", __source: { fileName: "", lineNumber: 15, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "text-[#e0aaff]", __source: { fileName: "", lineNumber: 16, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-user", __source: { fileName: "", lineNumber: 17, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: "text-[#e0aaff]", __source: { fileName: "", lineNumber: 19, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-wallet", __source: { fileName: "", lineNumber: 20, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: "bg-[#22c55e] hover:bg-[#16a34a] text-white px-4 py-2 rounded-full transition ease-in-out duration-300", __source: { fileName: "", lineNumber: 22, columnNumber: 13 }, __self: this }, "0x27A5....343B"))), /*#__PURE__*/ React.createElement("nav", { className: "text-center", __source: { fileName: "", lineNumber: 25, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { className: "flex justify-center space-x-8 mt-4", __source: { fileName: "", lineNumber: 26, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("li", { className: "cursor-pointer text-[#e0aaff]", __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this }, "Collections"), /*#__PURE__*/ React.createElement("li", { className: "cursor-pointer text-[#e0aaff]", __source: { fileName: "", lineNumber: 28, columnNumber: 13 }, __self: this }, "My NFTs"), /*#__PURE__*/ React.createElement("li", { className: "cursor-pointer text-[#e0aaff]", __source: { fileName: "", lineNumber: 29, columnNumber: 13 }, __self: this }, "Wallet"))), /*#__PURE__*/ React.createElement("main", { className: "py-8", __source: { fileName: "", lineNumber: 32, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-lg font-extrabold tracking-tight mb-6 text-[#e0aaff]", __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }, "Soletheon Dragon Egg Collection"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6", __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this }, galleryItems.map((item)=>/*#__PURE__*/ React.createElement("div", { key: item.id, className: "bg-white bg-opacity-10 shadow-lg rounded-lg overflow-hidden transform hover:scale-[1.05] transition duration-500 ease-in-out", __source: { fileName: "", lineNumber: 36, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { style: { paddingBottom: '100%', position: 'relative' }, __source: { fileName: "", lineNumber: 37, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: item.image, alt: `Image of ${item.name}`, style: { position: 'absolute', width: '100%', height: '100%', objectFit: 'cover' }, __source: { fileName: "", lineNumber: 38, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "py-4 px-2 text-center", __source: { fileName: "", lineNumber: 40, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-md font-medium", __source: { fileName: "", lineNumber: 41, columnNumber: 19 }, __self: this }, item.name), /*#__PURE__*/ React.createElement("p", { className: "text-xl font-medium mt-1", __source: { fileName: "", lineNumber: 42, columnNumber: 19 }, __self: this }, item.price, " NEON"), /*#__PURE__*/ React.createElement("p", { className: "text-xs", __source: { fileName: "", lineNumber: 43, columnNumber: 19 }, __self: this }, "Last sale: ", item.lastSale, " NEON")))))), /*#__PURE__*/ React.createElement("footer", { className: "border-t border-purple-300 py-4 mt-6 text-center", __source: { fileName: "", lineNumber: 49, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-xs text-[#e0aaff]", __source: { fileName: "", lineNumber: 50, columnNumber: 11 }, __self: this }, "© 2024 Dratini NFT Marketplace Pre-Release Beta")))); }