Used the JS fetch API & a custom react hook to fetch from an API

Hey Segni, I suggest you use <button className={styles.dice}> instead of <div className={styles.dice}>... Buttons are used for actions, and when using the image img inside the <button> without text, Set the attribute aria-label to describe the button, to add more semantic to your project.

<button 
           onClick={() => {
                 //...
             }}
           className={styles.dice}
           ariaLabel="Advice Generator">
    <img 
           src='/images/icon-dice.svg' 
           height={24} 
           width={24} 
           alt='dice'>
    </img>
</button>

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

Hi Segni!

This challenge has been spectacular, you have taken into account the responsive, the functionalities are going well, the transitions and effects are the same, personally it is well done.

The only thing left is to correct the error issue in the report that makes it easy if you change the advice from p to h1 or in any class you add a h1 inside your main and place the class sr-only with the following attributes:

https://stackoverflow.com/questions/19758598/what-is-sr-only-in-bootstrap-3

There they explain the use of the class but in general it will help you to have an h1 and this one is in your page but it is not seen so that it does not alter the design.

Success, keep it up. Good Coding!