Phoca Forum

Hello Jan,
i have made a fresh install of everything and followed the manual regarding Phoca Cart Gantry 5.

after following the steps, i have added the free shipping plugin, enabled and show image.
in Phoca Cart (installed demo content) i changed the add cart options from default to Ajax Popup.

the popup works, but the background of the popup has the height until bottom browser window.

in /media/com_phocacart/css/main.css i have added line 2382

line 2380 #phAddToCartPopup {
line 2381 z-index: 1051;
line 2382 height: fit-content;

after this change the background of the popup is now correctly sized based on the content..
is this the correct place to arrange this, or will this be gone after a update ?..

Hi,

jpeters wrote: ↑09 Jan 2021, 22:43 after this change the background of the popup is now correctly sized based on the content..
is this the correct place to arrange this, or will this be gone after a update ?..

I think you should make as follows:

Turn On Development Mode in Gantry
Disable Cache (while Dev Mode is open)
To enter your codes to: custom / scss / custom.scss


Recompile CSS

Kind regards
Christine

Hi, yes, use custom.scss like Christine wrote. When there is a problem with Popup, this can be even caused by Bootstrap library. Try to test if there are no two or more Bootstrap libraries loaded, etc.

Jan

christine wrote: ↑10 Jan 2021, 01:14 Hi,

jpeters wrote: ↑09 Jan 2021, 22:43 after this change the background of the popup is now correctly sized based on the content..
is this the correct place to arrange this, or will this be gone after a update ?..

I think you should make as follows:

Turn On Development Mode in Gantry
Disable Cache (while Dev Mode is open)
To enter your codes to: custom / scss / custom.scss


Recompile CSS

Kind regards
Christine

Hi,

I have the same issue with the popup height.
I want to add the lines jpeters mentioned but I cannot find the custom.scss in the custom folder (see screenshot below). Can it be somewhere else?
Also, I have seen where to turn on Development mode in Gantry but I do not know how to disable Cache. Could you please let me know how to do it?

Thanks in advance.

Hi, custom.css is not provided by the package. This file should be created by you. When it will be created by the package, then it will overwrite your changes every time update will be done. So this is why you should create own custom.css file.

Cache - I don't think, in Gantry, you can disable cache, but you can clear it. So every time you will do the change, just recreate CSS (it will automatically overwrite the CSS output with new) and/or clear the cache. Not sure if this happen automatically when development mode is enabled.



Jan