Post card UI improvement

[iitzIrFan]

#40 Add optimistic UI updates for create new post :-

• Added shadow-md for depth with respect to themes.
• Used loading="lazy" for image optimization.
• Increased text size for better legibility.
• Improved padding/margin consistency.
• Optimized spacing between the elements wherever required.
• Added object-cover to the post image to ensure proper aspect ratio handling on different screen sizes.

This PR is ready for Review ... Changes are always welcome :)

[harshmangalam]

I like your improvements but this is not optimistic ui. This is UI improvements.

Optimistic UI is a technique to improve responsive user experience by reducing the perceived latency. Suppoose in this case you created a new post but first it will interact with api in backend and resturn response and user have to wait for that .
When you have post data instead of waiting for api response after submit button click you can just create post card with colllected data from user input. And when api response will come it will validate the current post card and swap with api post details.

You can look into Remix example for more context
https://remix.run/docs/en/main/discussion/pending-ui

But we are using Qwik you can transform the same idea in qwik also.

Thanks for your contributions 🫡

[iitzIrFan]

@harshmangalam Actually I am new to TypeScript so I will try my best to optimize it ! Also will surely take help from you if needed to learn from you about OPTIMISTIC UI.