log in

Community feedback

• 

  Tharun Raj•1,330

  @Code-BeakerPosted 2 months ago

  Hey there, congratulations on completing this challenge... You've done a great work on this one! 🎉

  I visited your website and also took a look at the source code. I want to share some of my suggestions on your solution that might help you improve it.

  • Format your code. Formatting your code is helpful when collaborating or sharing your code as it makes reading the code easier and makes it well-structured. If you're using Visual Studio Code, you can install the Prettier extension and format the code.
  • Make sure to use appropriate tags to create the components. This is a list of links and it should be created that way.

  This is your current markup:

  <div class="btn">      
  <button> GitHub </button> 
  <button> Frontend Mentor </button>
  <button> Linkdin </button>
  <button> Twitter </button>
  <button> Instagram </button>
  </div>
  

  This should be an unordered list where each link should be a list item.

  A better and structured markup:

  <ul class="social-links">      
   <li class="social-links__item">
    <a href="#" class="social-links__link">GitHub</a>
   </li>
   <li class="social-links__item">
    <a href="#" class="social-links__link">Frontend Mentor</a>
   </li>
   ...
   ...
  </div>
  

  • Use CSS Variables to speed up your workflow. Many properties like colors, font-size, margins, paddings, etc. can be used with variables. This way, you don't have to type in the actual values of the property but a custom name you created for it.
  • Use rem or em instead of px. rem is a relative unit and is best when dealing with responsive layouts. Also, ensure you never use px to set font-size. Learn more

  These are areas where you can improve your solution. Keep learning and getting better. Good luck on your next projects.

  I hope you find this helpful... Happy coding! 😄

  Marked as helpful

  0

  ---

  

  mohamans-0•30

  @mohamans-0Posted 2 months ago

  thanks a lot !@Code-Beaker

  1