Replace all styling with Tailwind

[kylemh]

Blocked by #1724

[kylemh]

@subhajit20 You could gradually work on this one! One component and/or one page per PR. It's nice because you won't feel like there's a mountain of work. Just whatever you feel comfortable contributing.

[subhajit20]

@kylemh Sure, Can you assign this to me?

[kylemh]

Note that you may need to define Tailwind theme values to leverage the existing CSS values more ergonomically:

https://github.com/OperationCode/front-end/blob/main/common/styles/variables.css
https://github.com/OperationCode/front-end/blob/main/common/styles/media-queries.css
https://github.com/OperationCode/front-end/blob/main/common/styles/themeMap.js

[subhajit20]

@kylemh when I push changes this error is comming
Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17. Learn more: https://reactjs.org/link/switch-to-createroot

Will I change ReactDom.render to create room for all the test files?

[kylemh]

This is a Next.js application. ReactDOM.render is not used in this repository. Perhaps try re-installing dependencies? Hopefully you've gone through the README instructions!

[subhajit20]

This is a Next.js application. ReactDOM.render is not used in this repository. Perhaps try re-installing dependencies? Hopefully you've gone through the README instructions!

Sorry I have fixed that

[akash0708]

Hello @kylemh is the issue still open? I can help in converting the CSS of the footer to Tailwind. Since this is a big issue I hope it wouldn't be a problem with @subhajit20 if I join.

[kylemh]

I don't think it'd be a problem! Just steer clear of the work being done in #1746 obviously

[akash0708]

Yes, I will make sure I do that. Should I start working on this? Can you assign me?

[kylemh]

I can only assign one person to an issue on GitHub. Feel free to work on it regardless. Maybe post here what components you are working on for visibility.

[subhajit20]

hey @kylemh I am not able to make another pr, the create new pr popup is not coming on the pull request page .

[kylemh]

https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/proposing-changes-to-your-work-with-pull-requests/creating-a-pull-request hopefully this helps!

[subhajit20]

https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/proposing-changes-to-your-work-with-pull-requests/creating-a-pull-request hopefully this helps!

done that,Thanks

[kylemh]

@subhajit20 please note the changes I made here:
https://github.com/OperationCode/front-end/compare/main..ee6c78cfe6ef2bdb5a67a34857e0ccb7372ac9c7

• I changed some theme names and values.
• I installed twmerge (please read the docs and make sure that components using the className prop leverage the function that is exported from this package in the manner that I used in these changes).
• I fixed visual bug in ImageCard (while converting it to Tailwind)