Less intense icons with relative size

[Stephanie Leary]

The Material icons are set to a fixed pixel size, which doesn't always line up well with the inline text. Both the Material icons and the older Glyphicons lack spacing between the icon and text, making the interface look crowded when there are a lot of icons.

Branch coming up.

[Stephanie Leary (stephanieleary)]

This patch sets icons to a size relative to the surrounding text and adds a small margin to set them slightly apart. It also sets the opacity to 65%, making them less visually "loud."

https://git.evergreen-ils.org/?p=working/Evergreen.git;a=shortlog;h=refs/heads/user/sleary/lp1999408-not-so-loud-icons

[Josh Stompro (u-launchpad-stompro-org)]

I'm testing on https://bugsquash.mobiusconsortium.org/eg2/en-US/staff/splash

I'm not seeing the lower intensity icons there. The opacity: .65; is getting overwritten by another opacity: 1; entry. Testing with Chrome 110.0.5481.178

Screenshot attached.
Josh

[Susan Morrison (smorrison425)]

I see the change in AngularJS interfaces but not Angular. Attaching a screenshot.

[Christine Morgan (cmorgan-z)]

Looking at this on https://tiffany-master.gapines.org/ (Feedback Fest) in an incognito window, I am seeing the same thing that Susan saw (comment #3). The change appears in AngularJS interfaces but not in Angular interfaces.

[Scott Angel (scottangel1)]

So looking at this commit

https://git.evergreen-ils.org/?p=working/Evergreen.git;a=blobdiff;f=Open-ILS/src/eg2/src/styles.css;h=9825799c1715cbc115f38ef3cd21ee8ca6c5b51c;hp=b2391688d53b9a2cee1f7ccfd47fec55b827a136;hb=2d03b84d4bf6976446262f80e2299541dbfcbcb3;hpb=e7acf4a00c3948fac5f270926c3838459d57434e

It looks like the opacity is being set to 1 instead of .65;

[Terran McCanna (tmccanna)]

Removing pullrequest due to testing comments