NFT Preview Card Component

Community feedback

• 

  Jose Sanchez•380

  @JRS-DeveloperPosted over 2 years ago

  Hi Pedro, good work!

  About your question of the overlay, you only need to add a opacity: 1 to the overlay on hover and change the background color from hsl to hsla.

  .imgcontainer:hover .overlay {
      /* opacity: 0.7; */
      opacity: 1;
      /* background-color: hsl(178, 100%, 50%); /*
      background-color: hsla(178, 100%, 50%, 0.5); /*https://www.w3schools.com/html/html_colors_hsl.asp */
      cursor: pointer;
      margin-left: 20px;
  }
  

  Marked as helpful

  1

  ---

  

  Pedro Verde•60

  @verdepedroPosted over 2 years ago

  @JRS-Developer Thanks a lot for the feedback, I will test it out!

  0
• 

  imad•3,330

  @imadvvPosted over 2 years ago

  Hey Pedro, you can add transition to overlay like so transition: all 350ms ease-in-out;, but also seem like you add some extra margin, that you can actually center element with flex easy, you can read about flex here.

  #Happy_Coding

  Marked as helpful

  1

  ---

  

  Pedro Verde•60

  @verdepedroPosted over 2 years ago

  @imadbg01 Thanks a lot for the information! I will check it out!

  1