Art gallery website | HTML, CSS, JS

Hello frontend friends! 👋

This was long overdue but I finally completed my 2nd challenge on Frontend Mentor. 🎉 This project was an opportunity for me to test new approaches on the way I write my CSS.

Major challenge(s):

• I started using Sass maps with @each rules to generate helper classes easily. It is not perfect but I think is a good start.
• I started using custom CSS properties to better organise my CSS and reduce repetition.
• Getting the grid as per the design was more challenging than I thought. I initially started with by defining the height of each row for the main content for different viewport widths but I soon realised that this was difficult to maintain. I finally found an efficient solution by using the minmax() function with the grid-template-columns and grid-template-rows properties.

Your feedback would be much appreciated, especially if you have other ideas about how to better implement custom CSS properties in your workflow.

Thanks in advance. 🙏