From 08bea4c56fb178bf0edaff9e63472a6ebb3b550c Mon Sep 17 00:00:00 2001
From: Leon Xu <dcwinfield362@gmail.com>
Date: Mon, 30 Jan 2023 14:34:35 -0800
Subject: [PATCH] doc: add additional semantic code and event handler

---
 src/pages/CreatePost.jsx | 42 +++++++++++++++++++++++++++++++++++++++-
 1 file changed, 41 insertions(+), 1 deletion(-)

diff --git a/src/pages/CreatePost.jsx b/src/pages/CreatePost.jsx
index 5a9d486..3986eb4 100644
--- a/src/pages/CreatePost.jsx
+++ b/src/pages/CreatePost.jsx
@@ -17,7 +17,47 @@ const CreatePost = () => {
   const [generatingImg, setGeneratingImg] = useState(false);
   const [loading, setLoading] = useState(false);
 
-  return <div>CreatePost</div>;
+  const handleSubmit = () => {};
+
+  const handleChange = (e) => {};
+
+  const handleSurpriseMe = () => {};
+
+  return (
+    <section className="max-w-7xl mx-auto">
+      <div>
+        <h1 className="font-extrabold text-[#222328] text-[32px]">Create</h1>
+        <p className="mt-2 text-[#666e75] text-[16px] max-w[500px]">
+          Create imaginative and visually stunning images through DALL-E AI and
+          share them with the community
+        </p>
+      </div>
+
+      <form className="mt-16 max-w-3xl" onSubmit={handleSubmit}>
+        <div className="flex flex-col gap-5">
+          <FormField
+            label="Your Name"
+            type="text"
+            name="name"
+            placeholder="John Doe"
+            value={form.name}
+            handleChange={handleChange}
+          />
+
+          <FormField
+            label="Prompt"
+            type="text"
+            name="prompt"
+            placeholder="A plush toy robot sitting against a yellow wall"
+            value={form.prompt}
+            handleChange={handleChange}
+            isSurpriseMe
+            handleSurpriseMe={handleSurpriseMe}
+          />
+        </div>
+      </form>
+    </section>
+  );
 };
 
 export default CreatePost;