Recipe page, SCSS mixins and reusable styling

Solution retrospective
What I’m most proud of with this project is how I got to experiment with SCSS mixins to make my styles way more reusable. It was satisfying being able to set up mixins for things like breakpoints and typography, so I could keep my code clean and apply styles consistently without repeating myself everywhere. If I were to do it again, I’d probably take some extra time to make my mixins even smarter and more flexible, just to make the workflow smoother and future changes even easier.
What challenges did you encounter, and how did you overcome them?One of the main challenges I ran into was figuring out the best way to organize my SCSS, especially with all the maps, functions, and mixins I wanted to use. It took a bit of trial and error to get everything working together smoothly without making the code confusing or repetitive. I overcame this by breaking things down into smaller, focused files and testing my mixins on simple elements before applying them everywhere. This approach made it easier to spot issues early and helped keep my styles maintainable as the project grew.
What specific areas of your project would you like help with?If anyone has any suggestions for improving this, I’d love feedback on how I’m organizing my SCSS especially when it comes to managing maps, functions, and mixins for things like colors, spacing, and breakpoints. I’m also interested in any tips for making my mixins or utility functions even more flexible or efficient. Any advice or best practices on structuring larger SCSS projects would be super helpful!
Please log in to post a comment
Log in with GitHubCommunity feedback
No feedback yet. Be the first to give feedback on Ed Johnson's solution.
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord