function MinifigureShowcase({ title, subtitle, minifigures }) { return /*#__PURE__*/ React.createElement("main", { className: "w-full px-10", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("section", { className: "text-center mb-10", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-2 text-[#121212]", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, title), /*#__PURE__*/ React.createElement("p", { className: "text-[#121212]", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, subtitle)), /*#__PURE__*/ React.createElement("section", { className: "grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4", __source: { fileName: "", lineNumber: 8, columnNumber: 7 }, __self: this }, minifigures.map((fig, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-white p-5 shadow-md", __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: fig.image, alt: fig.alt, className: "w-full h-[200px] object-cover mb-2", __source: { fileName: "", lineNumber: 11, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-[#121212] mb-1", __source: { fileName: "", lineNumber: 12, columnNumber: 13 }, __self: this }, fig.name), /*#__PURE__*/ React.createElement("p", { className: "text-[#121212]", __source: { fileName: "", lineNumber: 13, columnNumber: 13 }, __self: this }, fig.price))))); } function MinifigureShowcaseStory() { const minifigures = [ { name: 'Classic Hero', price: '$9.99', image: 'path/to/minifig1.jpg', alt: 'A detailed minifigure of a classic superhero' }, { name: 'Wizard Genius', price: '$11.99', image: 'path/to/minifig2.jpg', alt: 'A miniature figure of a famous wizard' }, { name: 'Space Outlaw', price: '$12.99', image: 'path/to/minifig3.jpg', alt: 'A small figure of a space outlaw' }, { name: 'Detective Extraordinaire', price: '$10.99', image: 'path/to/minifig4.jpg', alt: 'A mini figure of a famous detective' } ]; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 30, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MinifigureShowcase, { title: "Our Collection", subtitle: "Find your favorite character in miniature form!", minifigures: minifigures, __source: { fileName: "", lineNumber: 31, columnNumber: 7 }, __self: this })); } function MainComponent() { const minifigures = [ { name: 'Classic Hero', price: '$9.99', image: 'path/to/minifig1.jpg', alt: 'A detailed minifigure of a classic superhero' }, { name: 'Wizard Genius', price: '$11.99', image: 'path/to/minifig2.jpg', alt: 'A miniature figure of a famous wizard' }, { name: 'Space Outlaw', price: '$12.99', image: 'path/to/minifig3.jpg', alt: 'A small figure of a space outlaw' }, { name: 'Detective Extraordinaire', price: '$10.99', image: 'path/to/minifig4.jpg', alt: 'A mini figure of a famous detective' } ]; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#F3F4F6] flex flex-col items-center pt-10 font-roboto", __source: { fileName: "", lineNumber: 10, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "w-full px-10 mb-5", __source: { fileName: "", lineNumber: 11, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 12, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl text-[#121212]", __source: { fileName: "", lineNumber: 13, columnNumber: 11 }, __self: this }, "MiniFig World"), /*#__PURE__*/ React.createElement("ul", { className: "flex space-x-5", __source: { fileName: "", lineNumber: 14, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("li", { className: "text-[#121212]", __source: { fileName: "", lineNumber: 15, columnNumber: 13 }, __self: this }, "Home"), /*#__PURE__*/ React.createElement("li", { className: "text-[#121212]", __source: { fileName: "", lineNumber: 16, columnNumber: 13 }, __self: this }, "Shop"), /*#__PURE__*/ React.createElement("li", { className: "text-[#121212]", __source: { fileName: "", lineNumber: 17, columnNumber: 13 }, __self: this }, "About"), /*#__PURE__*/ React.createElement("li", { className: "text-[#121212]", __source: { fileName: "", lineNumber: 18, columnNumber: 13 }, __self: this }, "Contact")))), /*#__PURE__*/ React.createElement(MinifigureShowcase, { title: "Our Collection", subtitle: "Find your favorite character in miniature form!", minifigures: minifigures, __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this })); }