Loopstudio landing page CSS Grid, Sass, BEM and AOS

Hey, once again, Marta! 👋

Of course—it's nice to see you complete another challenge! 😀 Nice work on this one! 👏 I like the on-scroll animation you added to the introductory section! 👍

I only suggest perhaps decreasing the height of the hero section in the desktop and mobile layouts (it seems quite high, at the moment).

As for the text in the hero section, you might have to decrease the font-size of that just a tad to prevent overflow issues on very small mobile devices.

I'm not an expert, but I don't think you have to worry too much about IE—it's very, very old by now and most developers seem more concerned about adding browser support for older versions of more popular browsers that are still in use (like Chrome, Firefox, etc.). 😉

Keep coding (and happy coding, too)! 😁

Hi, Marta!

Sorry I missed this solution! Congrats on completing another one - and good job on this one too! 😄

It looks fine to me on 320px screens - so perhaps you have already made fixes since originally posting your solution. I had to make an extra media query for screens below 375px for mine.

As for IE, I don’t think you need to worry about it generally. According to Can I Use, global usage for IE is barely above 1%. I see you’re already using an auto-prefixer, so you should be more than good.

I think it’s great that you added in some loading and scroll animations for different sections. My only suggestion here, and this is totally a personal preference, is to have all the hero animations end at the same time or very near. Right now the heading takes a bit longer than the nav.

I also suggest going in and taking another look at your gallery div in the creations section - from 768px to 783px the images get HUGE. Might want to adjust your media query so that your grid-template-columns gets applied a little earlier.

Looking forward to your next solution - and happy coding!