Media CSS override. How To?

Phoca Cart - complex e-commerce extension
User avatar
Jfruiz
Phoca Member
Phoca Member
Posts: 22
Joined: 24 Jan 2016, 17:49

Media CSS override. How To?

Post by Jfruiz »

I'm using Gantry Helium template with last Phoca Cart version and have made some changes in files media/com_phocacart/bootstrap/css/bootstrap4.min.css and media/com_phocacart/css/main.css to correct some glitches that appeared in the templete and adjust it a little to my preferences, but any time that I get a phoca cart update, logically I loose that mods.

Maybe this is a Joomla general question, more than a phoca cart related one, but moving the the changes to template custom.ccs do not work and after searching in the web I don not find information about how to override css files of media folder...

Is there any way to make a template override for those files?
User avatar
Jan
Phoca Hero
Phoca Hero
Posts: 47870
Joined: 10 Nov 2007, 18:23
Location: Czech Republic
Contact:

Re: Media CSS override. How To?

Post by Jan »

Hi, the question is, why does not work setting the changes in custom.css or user.css?

Are you 100% the custom.css or user.css is loaded on your site? It such CSS file loaded as last to override previous CSS rules?

Jan
If you find Phoca extensions useful, please support the project
maintainthedomain
Phoca Member
Phoca Member
Posts: 46
Joined: 21 Sep 2018, 11:34

Re: Media CSS override. How To?

Post by maintainthedomain »

check that you have templates/g5_helium/custom/scss/custom.scss

File is not there by default; you have to create the file/directory yourself.

The changes in that file will override BS styles.
User avatar
Jfruiz
Phoca Member
Phoca Member
Posts: 22
Joined: 24 Jan 2016, 17:49

Re: Media CSS override. How To?

Post by Jfruiz »

I see... I made changes in css/custom.css... not in scss/custom.scss

Will try again...

Thanks.
User avatar
Jfruiz
Phoca Member
Phoca Member
Posts: 22
Joined: 24 Jan 2016, 17:49

Re: Media CSS override. How To?

Post by Jfruiz »

I have restore the original files (media/com_phocacart/css/main.css and media/com_phocacart/css/main-product-image-move.css) and include the changes in templates/g5_helium/custom/scss/custom.scss, but changes do not apply that way

I have check the element in the browser and it only take properties form main.css not from custom.scss.

I'm sorry if that is a little stupid, unfortunately my knowledge about all this is mostly based on try/fault.
christine
Phoca Hero
Phoca Hero
Posts: 2734
Joined: 28 Nov 2010, 17:20

Re: Media CSS override. How To?

Post by christine »

Hi Jfruitz,
maintainthedomain wrote: 14 May 2020, 00:19 check that you have templates/g5_helium/custom/scss/custom.scss

File is not there by default; you have to create the file/directory yourself.

The changes in that file will override BS styles.
Tks for your information.

in addition: http://docs.gantry.org/gantry5/tutorial ... tyle-sheet
You need to recompile the CSS and clear the cache.

Kind regards
Christine
maintainthedomain
Phoca Member
Phoca Member
Posts: 46
Joined: 21 Sep 2018, 11:34

Re: Media CSS override. How To?

Post by maintainthedomain »

In Helium template -> Extras (top right corner)-> set it to Development mode

then you dont have to recompile css / clear cache all the time you make a change...

also make sure you're editing g5_helium/custom/scss/custom.scss
User avatar
Jfruiz
Phoca Member
Phoca Member
Posts: 22
Joined: 24 Jan 2016, 17:49

Re: Media CSS override. How To?

Post by Jfruiz »

For future reference, the overrides should go in g5_helium/scss/custom.scss not in g5_helium/custom/scss/custom.scss
User avatar
Jan
Phoca Hero
Phoca Hero
Posts: 47870
Joined: 10 Nov 2007, 18:23
Location: Czech Republic
Contact:

Re: Media CSS override. How To?

Post by Jan »

Hi, thank you for the info.

Jan
If you find Phoca extensions useful, please support the project
Post Reply