Things that needs addressing are as follows:
- this
<img src={burger} alt="burger" onClick={() => setMenuOPen(prev => !prev)}/>
, is acting as you menu to control the opening and closing the modal on mobile. Nicely done it is working, but now an image is not an interactive element and users who rely on assistive technology will not be able to know that the image is representing a button. You can either make the image a child of a button or see what aria attributes you have to add. - the list items are supposed to be anchor elements as they are supposed to be links to external pages.
- write your content in lowercase and use css to uppercase it , accordingly
<li className="lastli">CONTACT</li>
. That won't work well with screen readers. - headings are important in a site , you need to check your html structure again for elements that are suitable for headings - a handful of them are currently divs. Do not use divs if there is a proper element that can do the job. As an example, the following element should be your
h1
<div className="slogan" >
WE ARE CREATIVES
</div>
Happy coding
Marked as helpful
1