Mobile-first solution using HTML, SCSS (w/ BEM) and Vanilla JS.

Hi, Simon! 👋

Congratulations on finishing this challenge! 🎉 I hope that you are still online at Frontend Mentor.

It's great that there's a scrolling animation and in my opinion, it would be better if the users that don't want to see animations can turn off the scrolling animation. You can use prefers-reduced-motion media query to turn off the animation.

I have some feedback on this solution.

• Alternative text shouldn't contain any words that are related to the word "image" (e.g. logo).
• Any interactive elements such as buttons should have an accessible name or label. Otherwise, the screen readers don't know how to pronounce it.
• Avoid using br elements for presentational purposes. Read the "Accessibility concerns" part of the MDN documentation for br.
• Wrap the quoted content with p. blockquote element’s content is a quote, not a chunks of characters. Reference: hail2u/html-best-practices #use-appropriate-element-in-blockquote-element
• Use the em unit for media queries. It adapts when the users change their font size setting. Here are some references.
  • @media - CSS: Cascading Style Sheets | MDN #accessibility_concerns
  • PX, EM or REM Media Queries?
• Never set font-size on the html element. It will overwrite the user's browser's font size setting.
• input elements must have a label. I recommend using aria-label to give each of the input an accessible name.

I have three recommended videos. The first one tells how hard HTML is (HTML is not easy). The other two talk about modern CSS techniques and approaches.

• Manuel Matuzović - Lost in Translation - YouTube
• Andy Bell – Be the browser’s mentor, not its micromanager - YouTube
• Stephanie Eeckles - Scaling CSS Layout Beyond Pixels - YouTube

I hope this helps! Happy coding!

Hey, Simon! 👋

You've done a great job on this challenge! Your solution looks good and those animations are amazing! I also like the transition of the "+" and "x" buttons of the director cards. 🤩

Everything scales up/down pretty well! 👏

I only suggest taking a look at your solution report and trying to clear up some of the errors that are there (adding a <title> tag to the inline SVGs should help clear up a few errors). 😉

Keep coding (and happy coding, too)! 😁

damn bro ur site is lit keep going

Great work! I love the on scroll animations. Happy coding 😊