diff --git a/daily-thought-frontend/src/pages/feed.tsx b/daily-thought-frontend/src/pages/feed.tsx index 8928b02dba9658417255a53ef852e3cb0a20ee87..a69df1d0d33a9b7845bd002f287382f4ffa3c86d 100644 --- a/daily-thought-frontend/src/pages/feed.tsx +++ b/daily-thought-frontend/src/pages/feed.tsx @@ -1,4 +1,5 @@ import NavBar from "@/components/navigation/NavBar"; +import AnswerCard from "@/components/post/AnswerCard"; import Post from "@/components/post/Post"; import Question from "@/components/question/Question"; @@ -17,18 +18,36 @@ const Feed = () => { return( <> - <NavBar user={user} /> - {/* <Question /> */} - <div className="flex w-full justify-center flex-col items-center mx-auto max-w-4xl p-3 sm:px-6 lg:px-8 border-x"> - - <p className="text-pink-400">Your Feed</p> - - <Post post={{User: user, Content: "This is my post"}}/> - <Post post={{User: user, Content: "This is my post"}}/> - <Post post={{User: user, Content: "This is my post"}}/> - <Post post={{User: user, Content: "This is my post"}}/> - + <div className="w-full"> + <NavBar user={user} /> + </div> + <div className="flex w-full bg-c-pink flex-col items-center py-3"> + <div className="flex-1 max-w-4xl flex items-center flex-col justify-center"> + <div className="p-8"> + <h1 className="text-4xl font-bold tracking-tight text-c-green text-center">This is my question of the day</h1> + </div> + <p className="text-c-green">Most recent answer</p> + <div className="rounded-full my-4 w-xl"> + <div className="flex w-full justify-center flex-col items-center mx-auto p-3 sm:px-6 lg:px-8 max-w-4xl"> + <AnswerCard post={{User: user, Content: "This is my post"}}/> + </div> + </div> </div> + </div> + + <div className="flex-1 max-w-4xl flex items-center flex-col justify-center mx-auto"> + <div className="rounded-full my-4 w-xl"> + <div className="flex w-full justify-center flex-col items-center mx-auto p-3 sm:px-6 lg:px-8 max-w-4xl"> + <Post post={{User: user, Content: "This is my post"}}/> + <Post post={{User: user, Content: "This is my post"}}/> + <Post post={{User: user, Content: "This is my post"}}/> + <Post post={{User: user, Content: "This is my post"}}/> + </div> + </div> + </div> + + + </> ) }