function MainComponent() { const sampleContent = /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center w-full h-full bg-[#E0F7FA] font-crimson-text", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl text-[#00796B] font-bold mt-10", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, "مرحبا يا أطفال"), /*#__PURE__*/ React.createElement("div", { className: "mt-10 flex flex-col items-center", __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "images/egyptian_story.png", alt: "Egyptian story illustration", className: "w-[300px] h-[200px]", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "mt-10 w-full px-10", __source: { fileName: "", lineNumber: 8, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl text-[#004D40] font-semibold", __source: { fileName: "", lineNumber: 9, columnNumber: 11 }, __self: this }, "تعلم كيف تتحدث"), /*#__PURE__*/ React.createElement("p", { className: "mt-4 text-lg text-[#004D40]", __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this }, "اختر الكلمات لتكوين جملة:"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap mt-4", __source: { fileName: "", lineNumber: 11, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-[#FFB300] text-white p-2 m-2 rounded", __source: { fileName: "", lineNumber: 12, columnNumber: 13 }, __self: this }, "السلام"), /*#__PURE__*/ React.createElement("button", { className: "bg-[#FFB300] text-white p-2 m-2 rounded", __source: { fileName: "", lineNumber: 13, columnNumber: 13 }, __self: this }, "كيف"), /*#__PURE__*/ React.createElement("button", { className: "bg-[#FFB300] text-white p-2 m-2 rounded", __source: { fileName: "", lineNumber: 14, columnNumber: 13 }, __self: this }, "اسمك؟")), /*#__PURE__*/ React.createElement("div", { className: "mt-10", __source: { fileName: "", lineNumber: 16, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-[#00796B] text-white p-2 rounded", __source: { fileName: "", lineNumber: 17, columnNumber: 13 }, __self: this }, "إرسال"))))); return /*#__PURE__*/ React.createElement("div", { className: "h-screen", __source: { fileName: "", lineNumber: 25, columnNumber: 5 }, __self: this }, sampleContent, /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 27, columnNumber: 7 }, __self: this }, ` @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } div { animation: fadeIn 2s; } `)); }