XF 1.x User banners

WildcatMedia

Registered
I noticed something today while finishing up configuring the Flat Awesome + theme before unleashing it on our unsuspecting members. It is just a minor thing, but it explained what I felt looked wrong until I realized what was going on.

To me, the banners looked a lot darker.

In the stock XF theme, banners look like this:

upload_2017-1-26_15-24-3.png



Yet in FA+, we have this, using the exact same color:
upload_2017-1-26_15-25-5.png


Today I realized that the reason is due to XF adding a semi-transparent gradient to the background.

Now, this...

upload_2017-1-26_15-26-40.png


...would be much better. What I temporarily did (in the Chrome "Inspector") was tweak the RGBA value to set the opacity to 0.66. Some of our darker banners get more difficult to read due to this, and adjusting opacity makes this much easier to read.

I wondered if there was a blanket way to change opacity on the background color of all of these banners using CSS, or, if I am going to have to create an entire set of code for EXTRA.CSS with all new RBGA color values to replace them. That makes code maintenance a pain, though.

The other option might be to remove (or replace with one single color) the background colors completely, leaving the border.

Just tossing this out here for any ideas. I mainly worry about visitors with poorer eyesight (including myself) who might struggle to read those.
 

WildcatMedia

Registered
I don't want a gradient, but I can create a white/transparent PNG with no gradient to do the same. At least until I figure out what else I can do with the banners. I am looking at another CSS solution but it may be too convoluted to attempt.

Thanks Russ!
 

WildcatMedia

Registered
@Russ, I uploaded a 35% opacity white PNG file and that fixed the banners. Works well, and I can tweak opacity in the PNG if I want to lighten them further.

I am trying to find a similar background image setting for thread prefixes, but have not yet found where in the style properties this should be.
 

Russ

Pixel Exit Staff
On my phone but I think it's style properties -> general -> prefix, I think xenforo sets the gradient there by default
 

Pre-Sale Questions

If you have any questions or concerns you want to ask before you make a purchase don't hesitate to use one of our multiple support channels for your convenience.