profile-card-component-main

Community feedback

• 

  Danilo Blas•6,300

  @Sdann26Posted over 2 years ago

  Hi Vijay!

  Regarding design it is quite good, but I would recommend you to make the spacing in the letters where the numbers come out as follows.

  .content p {
    color: hsl(227, 10%, 46%);
    font-size: 13px;
    letter-spacing: 1px;
  }
  

  Although note that it is separating numbers and features and should only be in the written features.

  Lastly I would recommend adding a slight drop shadow to the card. For example:

  .wrapper {
    box-shadow: 0 2em 2em 0.1px rgba(45, 50, 72, 0.3);
  }
  

  With this I think I would leave it as is.

  Respecto a los errores de accesibilidad podrías cambiar <h2>Victor Crest <span>26</span></h2> por <h1>Victor Crest <span>26</span></h1> ya que siempre necesitas tener por página un h1. And you add the styles you need to add to get the layout right.

  Just those changes alone would do, you generate a new report and there should be 0 errors.

  If you have any questions feel free to ask them here :D!

  Marked as helpful

  1

  ---

  

  Vijay Choudhary•200

  @scriptyvijayPosted over 2 years ago

  @Sdann26 Thanks buddy I'll update it asap.

  1
• 

  Ahmed Bayoumi•6,740

  @Bayoumi-devPosted over 2 years ago

  Hey! I suggest you put the status of the profile card into the list item to add more semantics to your project, Div's don't do much for semantics but a list is much more meaningful..:

  <ul class="stats">
     <li><span class="stats-num">80K</span>Followers</li>
     <li><span class="stats-num">803K</span>Likes</li>
     <li><span class="stats-num"> 1.4K</span>Photos</li>
  </ul>
  

  Hope this is helpful to you... Keep coding👍

  Marked as helpful

  0