Page 1 of 1

How to change color of Download/Detail/Preview buttons?

Posted: 28 Jan 2012, 17:55
by rto
I'd like to change the colors of Download (green), Preview (red) and Detail (yellow) buttons to blue.
Can this be done from custom.css? What would be the code?
Thanks in advance for your appreciated help.

J1.7, PD 2.1.4

Re: How to change color of Download/Detail/Preview buttons?

Posted: 28 Jan 2012, 22:29
by SonRiab
Yes you have to edit the custom.css file and add something like this:

Code: Select all

#phoca-dl-category-box .pd-button-download a {
    background: url("images/btn.png") repeat-x scroll 0 0%, url("images/icon-download.png") no-repeat scroll 6px center #0000EE;
}

#phoca-dl-category-box .pd-button-details a {
    background: url("images/btn.png") repeat-x scroll 0 0%, url("images/icon-download.png") no-repeat scroll 6px center #0000EE;
}

#phoca-dl-category-box .pd-button-preview a {
    background: url("images/btn.png") repeat-x scroll 0 0%, url("images/icon-download.png") no-repeat scroll 6px center #0000EE;
}
(untested!)

Re: How to change color of Download/Detail/Preview buttons?

Posted: 29 Jan 2012, 01:29
by rto
Thank you for your reply. Your "untested" code works almost perfect! I only changed the icon files within details and preview buttons: pd-button-details: replaced icon-download.png with icon-details.png; pd-button-preview: replaced icon-download.png with icon-preview-png.
The buttons now appear in blue. But when I hoover over them the old color reappears. Is it possible to change this too? Where and how?
Thanks in advance for your help.

Re: How to change color of Download/Detail/Preview buttons?

Posted: 29 Jan 2012, 08:21
by SonRiab
Adjust the color here and add this to the css file:

Code: Select all

#phoca-dl-category-box .pd-button-download a:hover,
#phoca-dl-category-box .pd-button-details a:hover,
#phoca-dl-category-box .pd-button-preview a:hover  {
    background-color: #0C630C;
}

Re: How to change color of Download/Detail/Preview buttons?

Posted: 29 Jan 2012, 10:07
by rto
Thank you so much - you safed my day!
Your code works like a charme.

Greetings from Switzerland

Re: How to change color of Download/Detail/Preview buttons?

Posted: 29 Jan 2012, 11:03
by SonRiab
It was a pleasure for me!

Schöne Grüße aus Deutschland! (^_^)

Re: How to change color of Download/Detail/Preview buttons?

Posted: 13 Oct 2014, 20:02
by plamen
Hi,

In PD / Styles (CSS) there are several css files. Some of them published, some - not.
My intention is same - to change the green color of the download button. Bootstrap looks good, but editing bootstrap.min.css seems difficult.
How to do this in this menu?
Can not find custom.css.
Can I place above code in buttonrc.css?
Thanks in advance.

PD 3.0.4

Re: How to change color of Download/Detail/Preview buttons?

Posted: 14 Oct 2014, 23:31
by Jan
Hi, you can upload your own CSS, you don't need to edit bootstrap directly in min, you can add its classes e.g. to custom.css which will be loaded after bootstrap and will overwrite the bootstrap definition.

As default, the custom.css is not included so if you create it, it will be not overwritten by upgrade.

Jan

Re: How to change color of Download/Detail/Preview buttons?

Posted: 10 Nov 2014, 21:32
by plamen
Is any PD themes exist for version 3.0+ ?
(What is the location of custom.css?)
So, I created new css using menu item Styles(css), named it 'custom', it's name automaticaly became 'custom.css' and I placed the code cited inside.

Re: How to change color of Download/Detail/Preview buttons?

Posted: 11 Nov 2014, 20:59
by Jan
Hi, you can set other CSS name.

It is stored in:
media/com_phocadownload/css/custom/ folder.

Jan