Basic CSS3 gradients support

[CyberAP]

Currently all popular browsers support linear gradients (their latest stable versions).

• Chrome: -webkit-linear-gradient
• Firefox: -mox-linear-gradient
• Safari: -webkit-linear-gradient (nighty build, for <5.1 use -webkit-gradient(linear,...))
• Opera: -o-linear-gradient
• IE: filter(DXImageTransform) (or for 10: -ms-linear-gradient)

Surprisingly XenForo doesn't support them. If you would like to include a gradient background into a style property you'll get into a big trouble like a huge mess after you save a template with gradients in property. It happens because we should use a background-image property for gradients which is already supported by XenForo but allows you to use only one instance of it in a property. So when you save a template all your previous background images are erased and there is only one.
What I request is to include a basic support for gradients in XenForo. No need to create some new interface inside Style settings, just a property support.
Thanks.

Concept:

 

[digitalpoint]

So yeah... I know this is SUPER old, but was just going to make a suggestion for CSS3 gradients, but it's already here (and I forgot I participated in it).

What would be *really* nice is to just be able to define gradients in the admin area and then apply a gradient to a style property. Right now if you want to change a gradient (for example form-button-white-25px.png), you have to go digging and find the zillion places that image file is used.

Object oriented gradient definitions please.

But yeah... we use 100% CSS gradients for everything on digitalpoint.com, and it works just fine.

How many gradients can you spot that didn't require a gradient image file?

 

[Forsaken]

So yeah... I know this is SUPER old, but was just going to make a suggestion for CSS3 gradients, but it's already here (and I forgot I participated in it).

What would be *really* nice is to just be able to define gradients in the admin area and then apply a gradient to a style property. Right now if you want to change a gradient (for example form-button-white-25px.png), you have to go digging and find the zillion places that image file is used.

Object oriented gradient definitions please.

But yeah... we use 100% CSS gradients for everything on digitalpoint.com, and it works just fine.

How many gradients can you spot that didn't require a gradient image file?

View attachment 102834

I have a style property group I use for style specific settings that I throw gradients into, that way I just need to call whatever style property I need.

 

[digitalpoint]

I have a style property group I use for style specific settings that I throw gradients into, that way I just need to call whatever style property I need.

That's a good idea, but really only works for custom styles. Just wish the default XF style did it that way.