[docs] Logo does not display pointer cursor on hover for better UX

[Asin-Junior-Honore]

Steps to reproduce

Link to live example: (required)

Steps:

1. Go to the MUI website. Mui

2. Hover your mouse over the logo at the top of the page.

3. Observe the cursor behavior.

Current behavior

When hovering over the logo, the cursor remains the default (arrow) instead of changing to a pointer, even though clicking on the logo navigates to the homepage. This can cause confusion for users, as there is no clear indication that the logo is clickable.

Expected behavior

When hovering over the logo, the cursor should change to a pointer (cursor: pointer) to indicate it's clickable and leads back to the homepage. This provides a clearer visual cue for users.

Context

I am aiming to improve the user experience by providing a clear, standard visual cue that the logo is clickable. This aligns with common web practices where clickable elements (especially logos leading to homepages) show a pointer cursor on hover. It would enhance clarity and consistency for users navigating the website.

Your environment

npx @mui/envinfo

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

Search keywords: Logo hover cursor

[Asin-Junior-Honore]

Hi @mnajdova ,
I'd like to work on this fix if it's approved. Could you please assign it to me?

Thank you!

[mnajdova]

@Asin-Junior-Honore sure, feel free to open a PR :)

[Asin-Junior-Honore]

Hey @mnajdova 👋
I have just opened a PR. Kindly review it at your earliest convenience. Thanks! 🙂

[github-actions]

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

Note

@Asin-Junior-Honore How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.