feat: sort tailwind classnames in correct order

[catosaurusrex2003]

Description
format using https://www.npmjs.com/package/prettier-plugin-tailwindcss

more information -> https://tailwindcss.com/blog/automatic-class-sorting-with-prettier

Reasons

1. More consistent and organized class naming
2. Makes reading long classNames easier

Example
this unordered classes 👇
rounded uppercase px-2 no-underline border-orange-300 text-orange-500 border py-0 border-solid text-xs
gets converted to 👇
border-orange-300 text-orange-500 rounded border border-solid px-2 py-0 text-xs uppercase no-underline

Below is the image of the files which are affected due to this formatting

[AST0008]

Hey can i work on this? @catosaurusrex2003

[catosaurusrex2003]

@AST0008 lets wait for others to validate if this change is really necessary. Then you can pick this issue up 👍.

@AceTheCreator should we go forward with this ?

[garvthakre]

Hello @catosaurusrex2003 @AST0008 ,
I would like to work on this issue as it seems straightforward, and I believe I can make it effeciently.
Could you please assign this to me?
If it's okay, I can go ahead . Let me know how you'd like me to proceed.
Thanks!

[vikramnagwal]

@catosaurusrex2003 I think it would be good if these class names were sorted; it will make fixing the UI easier.