Order Summary Component (HTML | SCSS)

Hi, Krutagna! 👋

Congratulations on finishing this challenge! 👏

It's great that you don't do a lot of nesting when using Sass. Good job! 👍

I recommend reading "5 Handy Sass Code Snippets" article. In that article, you will find some useful @mixin to help you write Sass.

Some more suggestions from me.

• The illustration is a decorative image. So, leave the alternative empty (alt=""). This way, screen reader users won't have to listen to decorative elements. The same goes for the music icon.
• figure element doesn't need to wrap the img element. The only reason to use figure is if you need to include a figcaption. Otherwise img tag is fine.
• Always specify the type of the button. In this case, set the type of them as type="button". It will prevent the button from behaving unexpectedly.
• 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?

That's it! I hope this helps!