Responsive stats card | CSS, flex-box | BEM

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  👾Hello Kulek, congratulations for your new solution!

  Your solution is just amazing, you did a good wrapping everything inside the container.

  The BEM I think is a bit off, for example, the classes under the container should be card__wrapper__image and card__wrapper__text. I know BEM is kind hard to get used to.

  Here's quick guide for BEM naming classes: https://css-tricks.com/bem-101/

  To have exact same purple overlay effect for the image, matching the design files you can use, filter or mix-blend-mode (the best choice in my opinion). See the code below

  img {
  mix-blend-mode: multiply;
  opacity: 0.8;}
  

  👋 I hope this helps you and happy coding!

  Marked as helpful

  0

  ---

  

  Kulek•240

  @kkulekPosted over 2 years ago

  @correlucas thank you Lucas, much appreciated!

  0
• 

  Eliseu Caputo•110

  @eliseucaputoPosted over 2 years ago

  It was very similar to the real. I'm begginer yet, and the only one feedback I can do it that you could let the letter 'm' in uppercase, but this is very simple to do and it doesn't disturb your code. Good job @kkulek !!

  1

  ---

  

  Kulek•240

  @kkulekPosted over 2 years ago

  @eliseucaputo thank you! I fixed that small issue, but didn't reupload for such a tiny thing.

  Good luck with your studies! :)

  0