https://i.sstatic.net/BcCbj.png
Please take a look at the provided screenshot. In the list, some items are marked with an eye icon to indicate that they are hidden and not important for the user's immediate attention. However, this icon seems to have the opposite effect by drawing more attention rather than signaling that those items can be ignored.
I believe a possible solution could be applying an opacity style only to rows with the eye icon, but I am facing difficulties in implementing this. Disabling the rows completely is not an option as users should still be able to interact with them. Also, directly targeting elements with an icon for styling may cause issues with other design elements like chevron rows.
Are there any creative solutions to tackle this issue? Does anyone have any insights on how this can be resolved?
(For reference, the Ui fabric documentation on the nav component can be found here.)