function MainComponent() { const items = [ { name: "Home", icon: "fa-home" }, { name: "Menu", icon: "fa-book-open" }, { name: "About", icon: "fa-info-circle" }, { name: "Contact", icon: "fa-phone" } ]; const menuItems = [ { name: "Latte", price: "$4", description: "Creamy & smooth", images: [ "/images/latte1.jpg", "/images/latte2.jpg", "/images/latte3.jpg", "/images/latte4.jpg" ] }, { name: "Espresso", price: "$3", description: "Strong & bold", images: [ "/images/espresso1.jpg", "/images/espresso2.jpg", "/images/espresso3.jpg", "/images/espresso4.jpg" ] }, { name: "Matcha", price: "$5", description: "Healthy & refreshing", images: [ "/images/matcha1.jpg", "/images/matcha2.jpg", "/images/matcha3.jpg", "/images/matcha4.jpg" ] } ]; return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text bg-[#fafafa] min-h-screen", __source: { fileName: "", lineNumber: 31, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "bg-[#442c2e] text-white py-6", __source: { fileName: "", lineNumber: 32, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto flex justify-between items-center", __source: { fileName: "", lineNumber: 33, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-5xl font-extrabold italic", __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this }, "レコードバー 90年代のR&B"), /*#__PURE__*/ React.createElement("nav", { __source: { fileName: "", lineNumber: 35, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { className: "flex space-x-8", __source: { fileName: "", lineNumber: 36, columnNumber: 13 }, __self: this }, items.map((item)=>/*#__PURE__*/ React.createElement("li", { key: item.name, className: "flex items-center space-x-3", __source: { fileName: "", lineNumber: 38, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${item.icon} text-xl`, __source: { fileName: "", lineNumber: 39, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-lg font-semibold", __source: { fileName: "", lineNumber: 40, columnNumber: 19 }, __self: this }, item.name))))))), /*#__PURE__*/ React.createElement("main", { className: "container mx-auto py-16", __source: { fileName: "", lineNumber: 48, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("section", { className: "text-center mb-16", __source: { fileName: "", lineNumber: 49, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-4xl font-extrabold mb-6", __source: { fileName: "", lineNumber: 50, columnNumber: 11 }, __self: this }, "Our Menu"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8", __source: { fileName: "", lineNumber: 51, columnNumber: 11 }, __self: this }, menuItems.map((item)=>/*#__PURE__*/ React.createElement("div", { key: item.name, className: "bg-white p-8 rounded-lg shadow-lg text-left", __source: { fileName: "", lineNumber: 53, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-3xl font-semibold", __source: { fileName: "", lineNumber: 54, columnNumber: 17 }, __self: this }, item.name), /*#__PURE__*/ React.createElement("p", { className: "text-[#442c2e] font-extrabold mb-3", __source: { fileName: "", lineNumber: 55, columnNumber: 17 }, __self: this }, item.price), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 mb-6", __source: { fileName: "", lineNumber: 56, columnNumber: 17 }, __self: this }, item.description), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 gap-4", __source: { fileName: "", lineNumber: 57, columnNumber: 17 }, __self: this }, item.images.map((src, index)=>/*#__PURE__*/ React.createElement("img", { key: index, src: src, alt: `${item.name} image ${index + 1}`, className: "w-full h-[100px] object-cover rounded-lg", __source: { fileName: "", lineNumber: 59, columnNumber: 21 }, __self: this }))))))), /*#__PURE__*/ React.createElement("section", { className: "text-center mb-16", __source: { fileName: "", lineNumber: 67, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-4xl font-extrabold mb-6", __source: { fileName: "", lineNumber: 68, columnNumber: 11 }, __self: this }, "About Us"), /*#__PURE__*/ React.createElement("p", { className: "mx-auto w-full max-w-[800px] text-xl", __source: { fileName: "", lineNumber: 69, columnNumber: 11 }, __self: this }, "Welcome to our sophisticated 90s R&B record bar where you can enjoy a unique collection of vinyl records and drinks. Our carefully curated menu offers something for everyone. Come and unwind in our stylish and chic atmosphere.")), /*#__PURE__*/ React.createElement("section", { className: "text-center mb-16", __source: { fileName: "", lineNumber: 75, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-4xl font-extrabold mb-6", __source: { fileName: "", lineNumber: 76, columnNumber: 11 }, __self: this }, "Contact"), /*#__PURE__*/ React.createElement("form", { className: "mx-auto w-full max-w-[600px] bg-white p-8 rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 77, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 78, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-left mb-2 font-semibold text-lg", htmlFor: "name", __source: { fileName: "", lineNumber: 79, columnNumber: 15 }, __self: this }, "Name"), /*#__PURE__*/ React.createElement("input", { className: "w-full p-3 border border-gray-300 rounded-lg", type: "text", id: "name", name: "name", __source: { fileName: "", lineNumber: 80, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 82, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-left mb-2 font-semibold text-lg", htmlFor: "email", __source: { fileName: "", lineNumber: 83, columnNumber: 15 }, __self: this }, "Email"), /*#__PURE__*/ React.createElement("input", { className: "w-full p-3 border border-gray-300 rounded-lg", type: "email", id: "email", name: "email", __source: { fileName: "", lineNumber: 84, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 86, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-left mb-2 font-semibold text-lg", htmlFor: "message", __source: { fileName: "", lineNumber: 87, columnNumber: 15 }, __self: this }, "Message"), /*#__PURE__*/ React.createElement("textarea", { className: "w-full p-3 border border-gray-300 rounded-lg", id: "message", name: "message", rows: "5", __source: { fileName: "", lineNumber: 88, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: "bg-[#442c2e] text-white w-full py-3 rounded-lg text-lg font-semibold", type: "submit", __source: { fileName: "", lineNumber: 90, columnNumber: 13 }, __self: this }, "Send")))), /*#__PURE__*/ React.createElement("footer", { className: "bg-[#442c2e] text-white py-6 text-center", __source: { fileName: "", lineNumber: 95, columnNumber: 7 }, __self: this }, "© 2023 レコードバー 90年代のR&B. All Rights Reserved.")); }