category button from PD 2.1.9 to 3.0.6

[leonleon]

Hello
I try to move one web site from Joomla 2.5.17 to Joomla 3.4.
previous template was designed using Artisteer, new with Template toaster.

Dealing with Phoca download, I followed this
......831-how-to-migrate-extensions-from-joomla-2-5-to-joomla-3
99% is OK, but ...
The category buttons, in download section first page
present in Joomla 2.5.17 / Phoca download 2.1.9
are missing now in Joomla 3.4 / Phoca download 3.0.6

The page setup in Phoca download is the same on both sites.

I found that phocadownload.css has moved and contents are different.

What should I try to make category buttons appears in PD 3.0.6 ?

Thanks
Leon

[Jan]

Hi, not sure what you mean with "category buttons"?

Can you paste a screenshot what you exactly mean? (e.g. per imgur.com)

Jan

[leonleon]

Hi
first capture is from Joomla 2.5.17, download catégory buttons are presents
http://hpics.li/536ebad
second capture is from Joomla 3.4, download category buttons are missing
http://hpics.li/ae21a49
How to make buttons appears ?

Thanks
Leon

[Jan]

Aha, you mean the effect of the box - the styling:

This you can easily add in CSS:

- add background
- add border
- add border radius
- add border shadow


For example:

Code: Select all

.pd-categoriesbox {
   -webkit-border-radius: 5px;
   border-radius: 5px;
   -webkit-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.75);
   -moz-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.75);
   box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.75);
   background: #f0f0f0;
}

[leonleon]

Thanks
I am trying
Leon

[leonleon]

Hi Jan
I did some trials, without success.
first I pasted above code in template .css no result
I found in "Customize Phoca Download Theme"
Setting Custom CSS
You can edit custom.css in components/com_phocadownload/assets/custom.css . This CSS file overrides all other previous defined CSS files.
So I did
here is my custom.css content
.pd-categoriesbox {
-webkit-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.75);
box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.75);
background: #f0f0f0;
}
In theme settings I selected Display Specific Layout....
But no buttons.
If I use web inspector to see wha is page code around the missing button this is what I get:
http://s1.postimg.org/tnvdo64r3/capt1.png
May be you can see what is missing.
Thank you.
Leon

[Jan]

Hi, you don't need to select specific layout.

Check if the custom.css is loaded on the site.

Try to add some border color: e.g. border: 1px solid #ccc;

Jan

[leonleon]

Hi
I deselected specific layout.
I checked that custom.css is loaded, easy I am running on localhost using MAMP.
As you guess I am not a css expert...
so I continue to use firefox web inspector to find why buttons are not there...
Examining category area on screen and selecting Style editor, I found
see http://img11.hostingpics.net/pics/955775capt2.png
that #phoca-dl-categories-box div.pd-title
is defined in line 255... click on it and I discovered
see http://img11.hostingpics.net/pics/142058capt3.png
that 6 embedded .css are used plus system.css.
Now if I apply your proposed test on the first embedded .css
see http://img11.hostingpics.net/pics/250938capt4.png
I get buttons.

But my problem is that I can't find in my web site where is located this embedded .css
I think it is something downloaded from outside... not sure.

This files begins by:
/* Phoca Download https://www.phoca.cz/ https://www.phoca.cz/phocadownload */

/* Main */
.pd-hr-cb {
border-bottom: 3px solid #e9e9e9;
margin-bottom: 10px;
clear:both;
}
.pd-hr {
border-bottom: 3px solid #e9e9e9;
margin-bottom: 10px;
}
.pd-fl {
position: relative;
float: left;
}........

So now I know that it is possible to get buttons
I copied the embbeded previous files content
added the modification for buttons to appear, and place it in custom.css
checked permissions (755) and ownership.
It seems that this custom.css is present but not taken into account
because web inspector don't show it in his list
see left part in image 3 and 4.

What did I miss to enable this custom.css ?
Thanks for help.

[Jan]

Hi, the file you have paste the code here is:

media/com_phocadownload/css/main/phocadownload.css

the buttons here:
media/com_phocadownload/css/main/button.css
media/com_phocadownload/css/main/buttonrc.css

The custom.css if right ordered is loaded as latest and can overwrite above mentioned files.

Jan

[leonleon]

Hi Jan

thank you for file location.
I am able to edit it and get customized buttons now.

Thanks for your help

Leon