function MainComponent() { const sections = [ "home", "profile", "skills", "projects", "contact" ]; const [page, setPage] = React.useState("home"); const renderSection = ()=>{ switch(page){ case "home": return /*#__PURE__*/ React.createElement("section", { className: "flex flex-col items-center justify-center h-[calc(100vh-72px)]", __source: { fileName: "", lineNumber: 9, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "/path/to/kento-suzuki.jpg", alt: "Photo of Kento Suzuki", className: "w-[200px] h-[200px] rounded-full mb-12", __source: { fileName: "", lineNumber: 10, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-inter mb-4", __source: { fileName: "", lineNumber: 15, columnNumber: 13 }, __self: this }, "こんにちは！私は鈴木健斗です。")); case "profile": return /*#__PURE__*/ React.createElement("section", { className: "bg-white p-8", __source: { fileName: "", lineNumber: 20, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-inter text-[#343a40] mb-4", __source: { fileName: "", lineNumber: 21, columnNumber: 13 }, __self: this }, "プロフィール"), /*#__PURE__*/ React.createElement("p", { className: "text-[#343a40] mb-4 text-lg", __source: { fileName: "", lineNumber: 22, columnNumber: 13 }, __self: this }, "簡単な自己紹介文"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-inter text-[#343a40] mb-2", __source: { fileName: "", lineNumber: 23, columnNumber: 13 }, __self: this }, "経歴と学歴"), /*#__PURE__*/ React.createElement("p", { className: "text-[#343a40] mb-4", __source: { fileName: "", lineNumber: 24, columnNumber: 13 }, __self: this }, "ここに経歴と学歴が入ります"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-inter text-[#343a40] mb-2", __source: { fileName: "", lineNumber: 25, columnNumber: 13 }, __self: this }, "趣味や興味"), /*#__PURE__*/ React.createElement("p", { className: "text-[#343a40] mb-4", __source: { fileName: "", lineNumber: 26, columnNumber: 13 }, __self: this }, "ここに趣味や興味が入ります")); case "skills": return /*#__PURE__*/ React.createElement("section", { className: "bg-[#e9ecef] p-8", __source: { fileName: "", lineNumber: 31, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-inter text-[#343a40] mb-4", __source: { fileName: "", lineNumber: 32, columnNumber: 13 }, __self: this }, "スキル"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 33, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-[#343a40]", __source: { fileName: "", lineNumber: 34, columnNumber: 15 }, __self: this }, "プログラミング言語"), /*#__PURE__*/ React.createElement("div", { className: "text-[#343a40]", __source: { fileName: "", lineNumber: 35, columnNumber: 15 }, __self: this }, "ツールや技術"), /*#__PURE__*/ React.createElement("div", { className: "text-[#343a40]", __source: { fileName: "", lineNumber: 36, columnNumber: 15 }, __self: this }, "ソフトスキル"))); case "projects": return /*#__PURE__*/ React.createElement("section", { className: "bg-white p-8", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-inter text-[#343a40] mb-4", __source: { fileName: "", lineNumber: 43, columnNumber: 13 }, __self: this }, "プロジェクト"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 44, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#f8f9fa] p-4 rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 45, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "/path/to/project-image.jpg", alt: "Project Image", className: "w-[200px] h-[200px] mb-4", __source: { fileName: "", lineNumber: 46, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-[#343a40]", __source: { fileName: "", lineNumber: 51, columnNumber: 17 }, __self: this }, "プロジェクトの説明")))); case "contact": return /*#__PURE__*/ React.createElement("section", { className: "bg-[#e9ecef] p-8", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-inter text-[#343a40] mb-4", __source: { fileName: "", lineNumber: 60, columnNumber: 13 }, __self: this }, "連絡先"), /*#__PURE__*/ React.createElement("form", { className: "space-y-4", __source: { fileName: "", lineNumber: 61, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { className: "w-full p-2 border border-[#ced4da] rounded bg-[#ffffff]", type: "text", placeholder: "名前", name: "name", __source: { fileName: "", lineNumber: 62, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("input", { className: "w-full p-2 border border-[#ced4da] rounded bg-[#ffffff]", type: "email", placeholder: "メールアドレス", name: "email", __source: { fileName: "", lineNumber: 68, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("textarea", { className: "w-full p-2 border border-[#ced4da] rounded bg-[#ffffff]", placeholder: "メッセージ", name: "message", __source: { fileName: "", lineNumber: 74, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "w-full bg-[#007bff] text-white p-2 rounded", __source: { fileName: "", lineNumber: 79, columnNumber: 15 }, __self: this }, "送信")), /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 81, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://linkedin.com", className: "text-blue-500 mr-4", __source: { fileName: "", lineNumber: 82, columnNumber: 15 }, __self: this }, "LinkedIn"), /*#__PURE__*/ React.createElement("a", { href: "https://github.com", className: "text-blue-500", __source: { fileName: "", lineNumber: 85, columnNumber: 15 }, __self: this }, "GitHub"))); default: return null; } }; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 97, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "bg-[#f8f9fa] text-[#343a40] p-4", __source: { fileName: "", lineNumber: 98, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-xl font-inter", __source: { fileName: "", lineNumber: 99, columnNumber: 9 }, __self: this }, "鈴木健斗の自己紹介"), /*#__PURE__*/ React.createElement("nav", { className: "flex justify-evenly", __source: { fileName: "", lineNumber: 100, columnNumber: 9 }, __self: this }, sections.map((section)=>/*#__PURE__*/ React.createElement("button", { key: section, className: "font-inter", onClick: ()=>setPage(section), __source: { fileName: "", lineNumber: 102, columnNumber: 13 }, __self: this }, section)))), renderSection()); }