Stats preview card component responsive with @media

Community feedback

• 

  suhayb jirde•1,050

  @suhaybjirdePosted almost 2 years ago

  Well done but i have little advice that some gave me when i submitted this challenge

              <div class="comp">
                <h3>10k+</h3>
                <p>companies</p>
              </div>
              <div class="temp">
                <h3>314</h3>
                <p>templates</p>
              </div>
              <div class="que">
                <h3>12M+</h3>
                <p>queries</p>
              </div>
            </div>
  

  use ul of instead these div i it's not that much but it's good practice

  Marked as helpful

  2

  ---

  

  ASEM-TOP•20

  @ASEM-TOPPosted almost 2 years ago

  @suhaybjirde no you are not right

  0

  

  suhayb jirde•1,050

  @suhaybjirdePosted almost 2 years ago

  @ASEM-TOP ok not problem to let you now pls read the comments of my this solution 🥰✌

  0

  

  Mohamed•160

  @MohamedAtTopPosted almost 2 years ago

  @suhaybjirde Thank you for your help.

  1
• 

  Adriano•38,270

  @AdrianoEscarabotePosted almost 2 years ago

  Hi Mohamed, how are you? I really liked the result of your project, but I have some tips that I think you will enjoy:

  The hero image has a color slightly different from the Figma design, if you want to match the color you can reach this using mix-blend-mode with mix-blend-mode: multiply;. The multiply will make the image blend the div background and the opacity will make the image less evident and improve the blend between image/purple div. See the code below:

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

  To improve the code structure wrap this div:

  <div class="attribution">

  with the semantic tag footer

  The rest is great!

  I hope it helps... 👍

  0
• 

  ASEM-TOP•20

  @ASEM-TOPPosted almost 2 years ago

  you are very bad

  0
• 

  ASEM-TOP•20

  @ASEM-TOPPosted almost 2 years ago

  well done ! You can be a SOLUTION for other people.

  0