Responsive, dynamic NFT card preview using HTML-CSS

Community feedback

• 

  The Requiem•330

  @TheRequiemPosted almost 2 years ago

  I love your solution. It is almost perfect except for a few little things that I noticed. The <a> tags by default have an underline, that you should remove by adding a CSS property text-decoration: none;. The "3 Days left" part has a different styling than "0.041 ETH", you can surround the "3 Days Left" with <span></span> in HTML which is an inline element for text, and then set the CSS properties appropriately without affecting "0.041 ETH" part. "Creation of" part also needs to be styled appropriately with the design. Lastly, your hover animation is almost perfect, except that it is not transparent because, in background, you're using the variable to the HSL values provided for the cyan color. You should use rgba instead, where R,G, and B are the values of Red, Green, and Blue, and A is the alpha value that sets the opacity, something like 0.5 would do, so after converting those values, your property should be background: rgba(0, 255, 247, 0.5); . Just change those and I think this is probably the best solution to this challenge I've seen! Cheers!

  0

  ---

  

  Ogulcan•10

  @ogulcanalimPosted almost 2 years ago

  @TheRequiem thanks for all suggestions and your comment. I'll check and revise it as soon as I can.

  1