Web client menus sometimes gray out at odd browser size in Windows 10

[Terran McCanna]

In 3.2.2:

We've noticed on Windows 10 at some intermediate screen sizes (like on a tablet or when the browser is dragged to a size between the full view and the small mobile view) there is a point at which the menus appear to be grayed out and are difficult to read. It appears that the font has changed to the mobile view color as defined in the CSS, but the menu background is still the color of the full size menu. (See screenshot.)

We're seeing this in both Firefox and Chrome on Windows 10 on laptops and tablets, but not seeing it on Windows 7 machines.

[Garry Collum (gcollum)]

Also happens in Chrome on a Mac. It occurs when you are collapsing the screen, right before the menus collapse into a hamburger menu.

[Garry Collum (gcollum)]

The menu font changes color when the browser is sized to a width between 768px and 800px. Here's a patch that changes css so that the change takes place at 768px, the md column definition for bootstrap.
https://git.evergreen-ils.org/?p=working/Evergreen.git;a=shortlog;h=refs/heads/user/gcollum/lp1813078_menus_sometimes_grayed_out

[Kyle Huckins (khuckins)]

I have tested this code and consent to signing off on it with my name, Kyle Huckins and my email address, <email address hidden>.

[Jane Sandberg (sandbergja)]

Good catch, Garry. I've pushed this to master, rel_3_3, rel_3_2, and rel_3_1. Thanks, Terran, Garry, and Kyle.