Simple card component

Community feedback

• 

  Patrícia Silva•105

  @patriciarrsPosted over 3 years ago

  Hello there, I'm not sure if this is the best option but I used the CSS filter property to change the image color (https://developer.mozilla.org/en-US/docs/Web/CSS/filter). When I open the page it only shows the mobile design.

  1

  ---

  

  SlothyPete•20

  @slothPete7773Posted over 3 years ago

  @patriciarrsilva Hi! Thanks for the suggestion, I'll try that in my next try for sure. For when you open mine and it only shows a mobile view, it may because your screen width is less than my breakpoint, it's 1440px. You may press F12 and set the width to 1440px or larger.

  0
• 

  Giovani•90

  @giovanibulianPosted over 3 years ago

  Hey, SlothyPete. About the mask color on the image, I've used the ::before pseudo element of the div element containing the image to work that out. I'm not sure if my code is written in the best way possible, but you can check it out here.

  A little caveat: the parent element (i.e. the div containing the image) must have position: relative for that to work out.

  I've learned how to use it from Kevin Powell's YouTube Channel. There is a 3-video mini-series about that. Here is the first video.

  0

  ---

  

  SlothyPete•20

  @slothPete7773Posted over 3 years ago

  @giovanibulian Hello there, thanks a lot for the ideas, from your suggestion and your work :D

  I'll make sure to check that video out when I have some time, thanks!

  0