• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

View a gradient?

Neil E.

Active member
#1
Sounds weird but that is what I want to do. Here is a snapshot of the XF gradient files on my server.

xenforo87.jpg

I want to see what each one looks like, but there doesn't seem to be a way to view the file contents directly using the cpanel tools. I downloaded a file and opened it with photo software, but it doesn't look like anything I recognize. How do I find out what these gradients look like? Do I have to use CSS to apply each one to an element to see the effect of the gradient?
 

MagnusB

Well-known member
#2
Most of them are semi transparent, so opening them in a picture viewer or something would not really yield good results. Try creating an empty html file and apply the background on a box. Something like this:
Code:
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.testingGradient {
  margin: 40px;
  background: pink url('path/to/gradient/to/test.png') repeat-x;
  height: 12px;
  width: 50px;
}
</style>
</head>
<body>
<div class="testingGradient"><span>Testing mah gradient</span></div>
</body>
</html>
Just tweak that code a bit and you should be able to see it. (It's completely untested on my part, I just wrote it quickly).
 

Neil E.

Active member
#3
Instead of trying a new element as suggested, I increased the size of an existing element and applied every gradient in turn.
Of the 23 gradients, only the following were useful:
/form-element-focus-100.png
/navigation-tab.png
/tab-17px-light.png
/tab-unselected-25px-light.png