[Main Nav] Random issue on Icons colors

[MarionLemaire]

Bug report

Required System information

Node.js version: 20.9.0
Strapi version: 5.0.0-beta.13
Operating system: Windows WSL and OS

Describe the bug

When clicking on Settings > Review Workflows, or Settings > U&P > Roles, the color of Main Nav icons suddenly turn black.

Steps to reproduce the behavior

1. Check Main Nav icons : they are all OK
2. Click on icons : everything is OK
3. Click on Settings Side bar options : everything is OK until you click on Review Workflows OR Roles
4. Click again on one of these items : icon colors turn back to normal

Expected behavior

A clear and concise description of what you expected to happen.

Screenshots

Screencast.from.21-06-2024.15_33_55.webm

[WalkingPizza]

Seems related to the following blocks, possibly because the ampersand isn't being resolved correctly and the :focus and :hover styles are applied to all SVGs when hovering or focusing anything.

strapi/packages/plugins/users-permissions/admin/src/pages/Roles/pages/ListPage/components/TableBody.jsx

Lines 27 to 34 in ccb2b38

	&:hover,
	&:focus {
	svg {
	path {
	fill: ${({ theme }) => theme.colors.neutral800};
	}
	}
	}

strapi/packages/core/review-workflows/admin/src/routes/settings/index.tsx

Lines 308 to 313 in ccb2b38

	&:hover,
	&:focus {
	svg > path {
	fill: ${({ theme }) => theme.colors.neutral800};
	}
	}