Responsive landing page using Sass and Flexbox

What are you most proud of, and what would you do differently next time?

• How to use Sass mixins, partials, @use and @forward
• Give each element inside the article container padding to make the container more flexible
• Html semantics and why should I use them more
• Using media queries to change the layout for each screen
• Applying CSS reset to img,svg,picture,video elements make it so it's easier to style them later

What challenges did you encounter, and how did you overcome them?

I struggled to make the img element responsive but thanks to Kevin Powell CSS reset I made it flexible

img,
picture,
svg,
video {
  display: block;
  max-width: 100%;
}

The children of the article element were not organized well inside it because I gave padding to the article element.

I fixed this by giving each children inside the article their own padding and erase the padding on article element which made it more flexible to work with.

What specific areas of your project would you like help with?

I want to learn how to make the page more responsive

• When to use em/rem/px
• How to style img element better
• How to organize workspace better for example do I put media queries in a separate file if the main scss get too long

I would like any suggestion about learning resources