handling tailwind breakpoints in react
I am trying to figure out how to turn my webapp which was built for desktop into something more responsive. I am using t3 stack with tailwind. I know that tailwind provides breakpoints (sm, md, lg, etc), but im struggling to figure out a good way to change my layouts based on this. For instance, I have a sidebar in the desktop app that i want to turn into a bottom bar for the mobile app which uses a completely different component. How can my react code know if the screen size is sm, md, or lg?
