@GeorgeDaris
Posted
Hello again, Mustafa!
Your solution is very close to the design, and your CSS is concise, as is your JavaScript code. Regarding the hover state persisting on mobile, I would suggest you take a look at this stack overflow solution which uses a media query to check whether the device uses a mouse or not to conditionally add the styling.
There are some improvements you could make to your HTML markup. Wrap your content inside a main tag, and since the advice component is self-contained, you could use an article tag instead. The h1 and p are used correctly, but your button isn't accessible. Instead of using a div with a nested image, use a native button element and add the image as a pseudo element, or nest it without forgetting to specify it as a decorative element. You should also add a title attribute to it so screen reader users can know what it does.
Hope this helps! You're on a good track!
