NavBar Theming Issues

[andiesm813]

Description

This is an AppBuilder app showing a NavBar with a Nav icon and action icons, using a custom dark theme based on material dark, with custom surface background color (blue).

Expected result

34. Nav and action icons when pressed or focused should not be gray. That does not look good. Maybe they should have a similar style as the focused and pressed state of the raised button, with the primary color. The hover state seems fine, but maybe it's rather dark. I would suggest different opacity for the hover (around 20% black), 38% black for pressed and 28% black for focused. I couldn't find a material ui reference, so this is my personal opinion.

Attachments

[simeonoff]

Would you say this change will work equally well when the background of the navbar is on the darker side? Would the reduction in opacity not make the hover state less visible in such instances where the background is near black?

[andiesm813]

Hey @simeonoff , no it wont work equally well if the background of the navbar is on the darker side. Maybe we could make this work? If the background of the navbar is darker than some "luminosiry" value, then change the black to white... with different percentages: hover 10% white, pressed 28% white and focused 18% white.... should look like this.... this is just a suggestion based on personal opinion:

[github-actions[bot]]

There has been no recent activity and this issue has been marked inactive.

[ghost]

@sdimchevski hey! @zdrawku told me to assign all of these issues i created related to the material dark theme to you. But i see you are already assigned to some. These are visual inconsistencies between the ignite ui material dark theme and Material Design dark theme.

[github-actions[bot]]

There has been no recent activity and this issue has been marked inactive.