Page 1 of 2

Use background images for prosilvers pollbar

Posted: 23 Aug 2010, 16:34
by Steve
Lets add some background image instead of the default background colour for the poll results bar for prosilver based styles,creating a more etractive look to the phpBB3 poll results and uses different colours depending on the poll results percentage.

upload these images to prosilver/theme/images/*.*
images.zip
Open styles/prosilver/theme/colours.css
find:

Code: Select all

.pollbar1 {
	background-color: #AA2346;
	border-bottom-color: #74162C;
	border-right-color: #74162C;
}

.rtl .pollbar1 {
	border-left-color: #74162C;
}

.pollbar2 {
	background-color: #BE1E4A;
	border-bottom-color: #8C1C38;
	border-right-color: #8C1C38;
}

.rtl .pollbar2 {
	border-left-color: #8C1C38;
}

.pollbar3 {
	background-color: #D11A4E;
	border-bottom-color: #AA2346;
	border-right-color: #AA2346;
}

.rtl .pollbar3 {
	border-left-color: #AA2346;
}

.pollbar4 {
	background-color: #E41653;
	border-bottom-color: #BE1E4A;
	border-right-color: #BE1E4A;
}

.rtl .pollbar4 {
	border-left-color: #BE1E4A;
}

.pollbar5 {
	background-color: #F81157;
	border-bottom-color: #D11A4E;
	border-right-color: #D11A4E;
}

.rtl .pollbar5 {
	border-left-color: #D11A4E;
}
replace with:

Code: Select all

.pollbar1 {
        background-image: url("{T_THEME_PATH}/images/poll3.png");
	background-color: #AA2346;
	border-bottom-color: #74162C;
	border-right-color: #74162C;
}

.rtl .pollbar1 {
	border-left-color: #74162C;
}

.pollbar2 {
        background-image: url("{T_THEME_PATH}/images/poll3.png");
	background-color: #BE1E4A;
	border-bottom-color: #8C1C38;
	border-right-color: #8C1C38;
}

.rtl .pollbar2 {
	border-left-color: #8C1C38;
}

.pollbar3 {
        background-image: url("{T_THEME_PATH}/images/poll2.png");
	background-color: #FFBF00;
	border-bottom-color: #000000;
	border-right-color: #CCCCCC;
}

.rtl .pollbar3 {
	border-left-color: #AA2346;
}

.pollbar4 {
        background-image: url("{T_THEME_PATH}/images/poll2.png");
	background-color: #FFBF00;
	border-bottom-color: #000000;
	border-right-color: #CCCCCC;
}

.rtl .pollbar4 {
	border-left-color: #BE1E4A;
}

.pollbar5 {
        background-image: url("{T_THEME_PATH}/images/poll1.png");
	background-color: #F81157;
	border-bottom-color: #000000;
	border-right-color: #004000;
}
You can use any background image ;)

Open styles/prosilver/theme/content.css
find:

Code: Select all

fieldset.polls dd div {
	text-align: right;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	font-weight: bold;
	padding: 0 2px;
	overflow: visible;
	min-width: 2%;
}
replace with:

Code: Select all

fieldset.polls dd div {
	text-align: right;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	font-weight: bold;
	padding: 5px 2px;
	overflow: visible;
	min-width: 2%;
}
as you can see all i changed was this line padding: 5px 2px; to give us the height we need for the back ground image adjust it accordingly to the size of image you may use.
Refresh theme for prosilver.
pics:
old poll results.
b4.PNG
some poll percents.
pool1.PNG
pool2.PNG
pool3.PNG

Re: Use background images for prosilvers pollbar

Posted: 23 Aug 2010, 16:36
by cisco007
very nice steve!

Re: Use background images for prosilvers pollbar

Posted: 23 Aug 2010, 16:44
by KukY13
If if remember good, this can be simply done in ACP!
Or is this something else?

Re: Use background images for prosilvers pollbar

Posted: 23 Aug 2010, 16:50
by cisco007
where is that setting at? i can't find it!

Re: Use background images for prosilvers pollbar

Posted: 23 Aug 2010, 16:52
by KukY13
It's in ACP/Styles/Imagesets/Edit/Polling Images.

Re: Use background images for prosilvers pollbar

Posted: 23 Aug 2010, 16:56
by Steve
Doesnt seem to work.But mine does :D

Re: Use background images for prosilvers pollbar

Posted: 23 Aug 2010, 17:04
by cisco007
you will be editing them on the database Kuky that is not proper, this way i better!

Re: Use background images for prosilvers pollbar

Posted: 08 Sep 2010, 03:54
by Igor
Does this work on another style ?

Re: Use background images for prosilvers pollbar

Posted: 08 Sep 2010, 09:45
by Steve
What style? if prosilver based sure will :)

Re: Use background images for prosilvers pollbar

Posted: 08 Sep 2010, 13:19
by Igor
Steve© » 08 Sep 2010, 09:45 wrote:What style? if prosilver based sure will :)

My style is http://demo.phpbb3styles.net/4poziomSEO_blue.