Thermometer design

Do you have a better design for the thermometer? I love all of the features Joom Donation has to offer including the thermometer. However, the design sort of clashes with the design of the site I intend to use Joom Donation.

You might be able to play with the coding to substitute an image.

www.fundraiserinsight.org/thermometer/

www.fundraiserinsight.org/libs/thermomet...id=0&skin=small_vert

When you change the number values the "temperature" goes up, so by minipulating the image coding you might get something else. ie. 412 -- 8012 and 15000

Hello,

I have modified this thermometer to work with JD. I am not a programmer but I have manage to get this to work with JD.

The package is installable and has a place for your JD campaign ID.

You can see it in action here. www.highhillcamp.org/donate

It is all local so it doesn't go to another site for the images... (better for SSL)

I have submitted it to Tuan, I am sure she can clean it up and submit it with her next version.

I hope this helps some of you.

Have a great Day,

Jim

I know you can't change the design but are you able to make the area it sits in wider?
We are raising $5,000 in one campaign and the green thermometer cuts off the last # of what we have raised so, instead of showing we have $1,301... it shows $1,30

Do you know if this can be fixed on my end?

Here is the thermometer: www.indianyouth.org/organic-gardens.html
thank you

Have you tried adjusting the css padding of this file-

http: //www.indianyouth.org// components/ com_jdonation/assets/ css/ style.css" type="text/css"



/*** Class for heading message***/
.heading {
font-size: 15px;
font-weight: bold;
text-decoration: underline;
}
/*** Css for dispalying title of field name **/
table.jd_donor_table td.title_cell {
width: 25%;
font-weight: bold;
padding-left: 10px;
}
/*** Css for dispalying inputbox td **/
table.jd_donor_table td.field_cell {

}
/*** Css for display '*' next to required field ***/
.required {
padding-left : 5px;
color: red;
}
/*** CSS class for displaying message displayed above donation form **/
.msg {
font-weight: bold ;
}
/*** Display amount explaination next to each pre-defined amount**/
.amount_explaination {
font-weight: bold ;
}
span.error {
color : red ;
font-weight: 140% ;
}

Not too skilled with css
Not sure what you mean by type="text/css" ?

I am not sure what to modify? *sorry*

Find this file - components/ com_jdonation/assets/ css/ style.css

Make a copy of the original as a backup before playing with the css (ie. i usually rename the file style-orginal.css that way I know that is the file I started with), upload the backup on into the directory so you don't get them confused.

Change various %'s and px to see if you can make the margins fit

width: 25% - make it 35% etc

thanks for the reply...
yes, I did that to no avail : (

any other ideas would be appreciated!