stats-preview-card-component | html, scss, flexbox | mobile first

i encountered a problem with the image – being it changes the image for mobile and desktop. the solution i came up with was to create a decoy image and put the opacity to 0. then i created a div with the class overlay where i change the background image based on the view port. that seems to solve the problem.

before coming to that solution, however, i thought of putting two images then hide one for different viewports, but it would be unnecessary to download the desktop version when it's open from a mobile device.

i couldn't get the color of the overlay right tho. any suggestion would be appreciated!