Stats Preview Card Component

Community feedback

• 

  P

  visualdennis•8,375

  @visualdennissPosted over 1 year ago

  Hey there Emil,

  nice work with the stats preview challenge. Looks also responsive. It seems like you have not implemented the color filter, but you can do that easily with:

  • giving a background color to the .right (container of the img) background: hsl(277, 63%, 61%);

  • then to the img simply give these: mix-blend-mode: multiply; opacity: .75;

  hope you find this feedback helpful!

  Marked as helpful

  1

  ---

  

  Benjamin B.•240

  @benjaminbilgehanPosted over 1 year ago

  @visualdenniss I just wanted to give a try and make the life easier for @caretaker03 Emil

  Thanks man! I learnt a nice tip from you. @visualdenniss

  img {
      width: 100%;
      height: 100%;
      border-top-right-radius: 15px;
      border-bottom-right-radius: 15px;
      mix-blend-mode: multiply;  /*Added this*/
      opacity: .75; /*Added this*/
      
  }
  

  and

  .right {
      width: 50%;
      border-bottom-right-radius: 15px;
      border-top-right-radius: 15px;
      background: hsl(277, 63%, 61%); /*Added this*/
  }
  

  Marked as helpful

  1

  

  P

  visualdennis•8,375

  @visualdennissPosted over 1 year ago

  @benjaminbilgehan Happy to hear it was useful for you! Yes, the code you have share is correctly shows how it can be used.

  0