diff options
Diffstat (limited to 'packages/web/src/app/_components/post.tsx')
| -rw-r--r-- | packages/web/src/app/_components/post.tsx | 19 |
1 files changed, 11 insertions, 8 deletions
diff --git a/packages/web/src/app/_components/post.tsx b/packages/web/src/app/_components/post.tsx index 9a1251f..5fb8ba8 100644 --- a/packages/web/src/app/_components/post.tsx +++ b/packages/web/src/app/_components/post.tsx @@ -15,34 +15,37 @@ export function LatestPost() { }); return ( - <div className="w-full max-w-xs"> + <div className="w-full max-w-sm"> {latestPost ? ( - <p className="truncate">Your most recent post: {latestPost.name}</p> + <p className="truncate text-[#999999]"> + your most recent post:{" "} + <span className="text-white">{latestPost.name}</span> + </p> ) : ( - <p>You have no posts yet.</p> + <p className="text-[#666666]">you have no posts yet.</p> )} <form - className="flex flex-col gap-2" + className="mt-3 flex flex-col gap-3" onSubmit={(formSubmitEvent) => { formSubmitEvent.preventDefault(); createPost.mutate({ name }); }} > <input - className="w-full rounded-full bg-white/10 px-4 py-2 text-white" + className="w-full border border-[#2a2a2a] bg-[#0f0f0f] px-3 py-2 text-white placeholder:text-[#666666] focus:border-[#666666]" onChange={(inputChangeEvent) => setName(inputChangeEvent.target.value) } - placeholder="Title" + placeholder="title" type="text" value={name} /> <button - className="rounded-full bg-white/10 px-10 py-3 font-semibold transition hover:bg-white/20" + className="w-full border border-[#2a2a2a] bg-[#0f0f0f] px-4 py-2 text-white transition-colors duration-100 hover:border-[#666666] disabled:text-[#666666] disabled:hover:border-[#2a2a2a]" disabled={createPost.isPending} type="submit" > - {createPost.isPending ? "Submitting..." : "Submit"} + {createPost.isPending ? "submitting ..." : "submit"} </button> </form> </div> |