Stats preview card component

Community feedback

• 

  Alex G•315

  @AlexGDevProPosted over 3 years ago

  Hello,

  Nice work !

  You can add border-radius for corners. And check font, because it's not the same font for Stats.

  You could try to do a mobil version like in picture in the challenge's folder.

  For the overlay you've many way to obtain it. Like say Vanza you could use Background-blender-mode. You could add a div with a rgba() over the image. You can add an ::after on the img too with a rgba().

  For the HTML, be careful you've got a lot of errors. Using div inline isn't possible, you better use span for inline content. Div is a block, span is inline. Same for using span instead of div it isn't good. You've put the img in html and out of boxes, but img default display is inline so you need to put it in a block content, even if you can modify display it's better to put it in a box.

  For the font-weight, you have to use only one value, in letter like 'normal' or in number like '400', but only one.

  Check the Stats font, it's not the same as the rest.

  Hope that will help you. Keep coding and have a nice day

  1

  ---

  

  Jeongsu•50

  @hosu9466Posted over 3 years ago

  @AlexGDevPro Wow. How kind you are. I will check those things you say and I will fix it. Thank you.

  0

  

  Alex G•315

  @AlexGDevProPosted over 3 years ago

  @hosu9466

  I'm a beginner and learning, so doing a review on other people's code is a good way to fix your knowledge :)

  And I see that I noticed the problem of different fonts twice. It seems I really don't like this difference ^^.

  1
• 

  Vanza Setia•27,775

  @vanzasetiaPosted over 3 years ago

  You can try to learn background-blend-mode to make the img has purple overlay.

  Here is a link about Background Blend Mode from CSS Tricks

  1

  ---

  

  Jeongsu•50

  @hosu9466Posted over 3 years ago

  @vanzasetia Thank you for your kind reply. It helps me a lot. Thank you

  0