Hi there!
I am styling a reactive web app using media queries for a mobile responsive fit.
Let me know if this approach is correct:
General - style.css
I put the general style: reset box sizing, font size, colors, etc…
Components - css
For each module, navbar.css header.css, etc… I build individual styles
About the media queries, should I put each “media queries” inside each respective module like navbar.css header.css, etc…???
How would you structure the project?
Thank you
P.
Theres really no one true way to style react, and it kind of depends on project to project. More than likely I think the approach you want to take though is using a style sheet for every component. If you have lets say 3-4 large components you are using then if you use just one file sheet things are going to get out of hand really quickly. Using a stylesheet for each component will make sure everything stays organized, and you can quickly find a problem in the css if you need to.
However, there is also something called style-components, and I am actually a fan of those. I have used them from time to time in my own personal projects that I built before. Just for your reference if you want to check it out
Thank you for sharing your opinion and style-components. I am gonna have a look right now.
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.