Fylo storage component with SCSS and BEM( ✨custom effects✨ )

Hey frontendmentor community!👋

This is my solution to the Fylo data storage component challenge!

It was a short and easy one, but a bit tricky!👻

Features👾:

• Custom hover effects🎨
• Full responsiveness📱 ( this one was very fun to build )
• Built with SCSS🔥
• BEM methodology🧠

For the responsive design, I used expresssions like:

• calc([fixed value] + [small responsive value])

Example: calc(7rem, .5vw)

It's very useful for elements like text that need only slight changes in size, so this way you don't need to bother with media queries, keeping the code cleaner

• max/min/clamp([responsive value], [fixed value limit])

Example: min/max(30vw, 20rem)

It stops at 20rem if 30vw is bigger/smaller than that and acts as a max/min-width for the element. Useful to keep the code clean and avoid extra media queries

Feedback and advice very much welcomed!🙏

Happy coding!