Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Advice generator using reactjs

chaitanya 460

@Chaitanya-087

Desktop design screenshot for the Advice generator app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
  • API
2junior
View challenge

Design comparison


SolutionDesign

Community feedback

Prithvi 110

@Prithvi12890

Posted

Hello Chaitanya!

Amazing work with the advice generator! It is fast and really good. Your code is well organized and easy to read & understand too. The styling looks good, close to the given design.

Though the accessibility issues can be ignored, you can remove them with the following steps:

  • In card.js, you can try giving the button a title attribute, as you are using an image as a button and don't want any text, so.. <button className="btn" onClick={() => setClick(!Click)}> <img className="dice" src={Dice} alt="" /> </button> to <button className="btn" onClick={() => setClick(!Click)} title="dice"> <img className="dice" src={Dice} alt="dice" /> </button>

  • In index.html try changing <div id="root"></div> to <div id="root" role="main"></div>

Hope this helps you and am looking forward to more works from you ✌

Marked as helpful

1

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord