function ImageSliderHeader({ images = [] }) { return /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "flex justify-around p-4 bg-[#121212] text-white font-crimson-text", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "#about", className: "hover:underline", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, "About"), /*#__PURE__*/ React.createElement("a", { href: "#works", className: "hover:underline", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, "Works"), /*#__PURE__*/ React.createElement("a", { href: "#contact", className: "hover:underline", __source: { fileName: "", lineNumber: 7, columnNumber: 9 }, __self: this }, "Contact")), /*#__PURE__*/ React.createElement("div", { className: "w-full h-[400px] overflow-hidden relative", __source: { fileName: "", lineNumber: 9, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex w-full h-full", __source: { fileName: "", lineNumber: 10, columnNumber: 9 }, __self: this }, images.map((img, index)=>/*#__PURE__*/ React.createElement("img", { key: index, src: img.src, alt: img.alt, className: "w-full object-cover h-full", __source: { fileName: "", lineNumber: 12, columnNumber: 13 }, __self: this }))))); } function ImageSliderHeaderStory() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 27, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(ImageSliderHeader, { images: [ { src: "/images/slide1.jpg", alt: "Slide 1 image of a project" }, { src: "/images/slide2.jpg", alt: "Slide 2 image of an event" }, { src: "/images/slide3.jpg", alt: "Slide 3 image of a landscape" } ], __source: { fileName: "", lineNumber: 28, columnNumber: 7 }, __self: this })); } function MainComponent() { return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text bg-gray-100 min-h-screen", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "w-full", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement(ImageSliderHeader, { images: [ { src: "/images/slide1.jpg", alt: "Slide 1 image of a project" }, { src: "/images/slide2.jpg", alt: "Slide 2 image of an event" }, { src: "/images/slide3.jpg", alt: "Slide 3 image of a landscape" } ], __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("section", { id: "about", className: "p-8 text-center", __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }, "About"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, "魅力的でおしゃれなデザインのポートフォリオへようこそ。")), /*#__PURE__*/ React.createElement("section", { id: "works", className: "p-8 text-center", __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }, "Works"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, "私の作品を以下でご覧ください。")), /*#__PURE__*/ React.createElement("section", { id: "contact", className: "p-8 text-center", __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 23, columnNumber: 9 }, __self: this }, "Contact"), /*#__PURE__*/ React.createElement("form", { className: "space-y-4 max-w-md mx-auto", __source: { fileName: "", lineNumber: 24, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 25, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-left", htmlFor: "name", __source: { fileName: "", lineNumber: 26, columnNumber: 13 }, __self: this }, "Name"), /*#__PURE__*/ React.createElement("input", { name: "name", type: "text", className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 29, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-left", htmlFor: "email", __source: { fileName: "", lineNumber: 30, columnNumber: 13 }, __self: this }, "Email"), /*#__PURE__*/ React.createElement("input", { name: "email", type: "email", className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 31, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-left", htmlFor: "message", __source: { fileName: "", lineNumber: 34, columnNumber: 13 }, __self: this }, "Message"), /*#__PURE__*/ React.createElement("textarea", { name: "message", className: "w-full p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 35, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-green-500 text-white py-2 rounded", __source: { fileName: "", lineNumber: 37, columnNumber: 11 }, __self: this }, "Send")))); }