swiperjs react-router-dom

Community feedback

• 

  Lucas 👾•104,400

  @correlucasPosted about 2 years ago

  👾Hello Oladejo, Congratulations on completing this challenge!

  Here’s some tips to improve your solution code:

  1.The colors you’ve used are a little bit different from the original colors.When you download the project files there’s a file called style-guide.md where you can find information such as font-family, hsl color codes, device sizes and the font-size for the headings.

  2.The best to way to have this image and every image responsive and easy to work, its by creating a general property adding display: block and max-width: 100% to make it fits the size of the container the image is inside and also respect the container width while scaling, add alsoobject-fit: cover to make the image auto-crop when resizing inside the column:

  img {
      display: block;
      object-fit: cover;
      max-width: 100%;
  }
  

  3.If you’re not familiar to media queries and responsiveness, here’s a good resource to learn it: https://www.w3schools.com/css/css_rwd_mediaqueries.asp

  ✌️ I hope this helps you and happy coding!

  Marked as helpful

  1
• 

  Travolgi 🍕•31,400

  @denieldenPosted about 2 years ago

  Hi Oladejo, congratulations on completing the challenge, great job! 😁

  Some little tips for optimizing your code:

  • add header tag and wrap the nav to improve the Accessibility
  • add main tag and wrap the contnt of page to improve the Accessibility
  • as soon as the monitor exceeds the 1440px the whole site broken. Adjust the breakpoints so that from 1440px and up the design remains the same
  • add more descriptive text in the alt attribute of the images
  • instead of using px use relative units of measurement like rem -> read here

  Hope this help! Happy coding 😉

  Marked as helpful

  1

  ---

  

  Oladejo Eniola•150

  @niol08Posted about 2 years ago

  @denielden thanks

  1

  

  Travolgi 🍕•31,400

  @denieldenPosted about 2 years ago

  @niol08 you are welcome! keep it up :)

  Marked as helpful

  1