Change the background image of the page

Phoca Templates - templates for Joomla! CMS
christine
Phoca Hero
Phoca Hero
Posts: 1675
Joined: 28 Nov 2010, 17:20

Re: Change the background image of the page

Post by christine » 02 Aug 2019, 10:28

Hi Thierry,
jourdaon wrote:
01 Aug 2019, 19:58
I still have a joke in the menu gantry, to change the color of the icons. The default gray icons I do not like ... for the rest it will be fine like that ...
Which gray icons do you mean?

Image
Kind regards
Christine

Tags:

jourdaon
Phoca Member
Phoca Member
Posts: 25
Joined: 29 Jul 2019, 19:45

Re: Change the background image of the page

Post by jourdaon » 02 Aug 2019, 13:23

Hello Christine,

The fa-fa icons of the Gantry menu, I find how to change the color, but I think there is a kind of smudge layer in percentage on it. And I did not find any settings ...

Image

Image

It is necessary that I change the typo in Uppercase ... but that I think I can find it not too difficult.

Kind regards
Thierry

christine
Phoca Hero
Phoca Hero
Posts: 1675
Joined: 28 Nov 2010, 17:20

Re: Change the background image of the page

Post by christine » 02 Aug 2019, 19:41

jourdaon wrote:
02 Aug 2019, 13:23
The fa-fa icons of the Gantry menu, I find how to change the color, but I think there is a kind of smudge layer in percentage on it. And I did not find any settings ...
as I don't see YOUR template with the Gantry menu, I checked YOUR site with Helix

Check the: font-awesome.min.css > just only for the segments > don't change there. Put required code (see other posts) into your custom.scss.
There are: i.fa.fa-home, i.fa.fa-info, i.fa.fa-user-plus.
Example could be (for all):

Code: Select all

.fa {
font-size:18px;  
color:#ffcc00;  
}
It is necessary that I change the typo in Uppercase

Code: Select all

#g-navigation a {
 text-transform: uppercase;
}
Kind regards
Christine

jourdaon
Phoca Member
Phoca Member
Posts: 25
Joined: 29 Jul 2019, 19:45

Re: Change the background image of the page

Post by jourdaon » 02 Aug 2019, 20:48

Hi Christine,

I open the store link on the site, in all ways, I do not have customers yet ... as you can see more easily.

For the CSS it is rather # g-navigation otherwise it also takes the sub menus and then I put .g-dropdown to return to normal formatting for layers sub menus.
That works well...
For the icons, that's what I thought, but I still have not found the solution, there is surely an opacity on it. if I change the color, the section selects loses its icon because the background is also white.

# G-navigation {
   background-image: url ('https://www.misso-shop.com/images/fond_degrade.png');
   text-transform: uppercase;
   font-size: 14px;
   font-weight: bold;
}

/ * sub menu fonts * /
g-dropdown {
  text-transform: none;
}

This is moving forward ...

Thank you Christine
Kind Regards

christine
Phoca Hero
Phoca Hero
Posts: 1675
Joined: 28 Nov 2010, 17:20

Re: Change the background image of the page

Post by christine » 02 Aug 2019, 22:49

Hi Thierry,
jourdaon wrote:
02 Aug 2019, 20:48
I open the store link on the site, in all ways, I do not have customers yet ... as you can see more easily.
This make sense :-) ... because:
For the CSS it is rather # g-navigation otherwise it also takes the sub menus and then I put .g-dropdown to return to normal formatting for layers sub menus.
My code above was from the Demo > there is no sub menu, therefore ...
That works well...
that's fine.
For the icons, that's what I thought, but I still have not found the solution, there is surely an opacity on it. if I change the color, the section selects loses its icon because the background is also white.
Found under: /_nav.scss maybe the reason for:
.g-main-nav .g-toplevel i {
opacity: 0.6;
}
as above CSS is compiled, try following into your custom.scss (for the icons in navigation):
.g-main-nav .g-toplevel i {
opacity: 1.5 !important;
color:#ffcc00;
}
Kind regards
Christine

jourdaon
Phoca Member
Phoca Member
Posts: 25
Joined: 29 Jul 2019, 19:45

Re: Change the background image of the page

Post by jourdaon » 03 Aug 2019, 17:39

Hi Christine,

Yes, that was it:

.g-main-nav .g-toplevel i {
   opacity: 1;
}

I think now my template is very similar ...

I just have some stuff in my body, but it should be fine.

I can tackle something else, including payment modules ...
For CSS it's fine like that,

Thank you for all the help you gave me Christine.
In addition I understand much better the operation of gantry.

Kind Regards
Thierry

christine
Phoca Hero
Phoca Hero
Posts: 1675
Joined: 28 Nov 2010, 17:20

Re: Change the background image of the page

Post by christine » 03 Aug 2019, 22:31

Hi Thierry,

thanks for your feedback & fine, that some informations were successful. I will close this thread.
For new questions (theme) etc. new thread with URL :-)

Kind regards
Christine

User avatar
Jan
Phoca Hero
Phoca Hero
Posts: 41483
Joined: 10 Nov 2007, 18:23
Location: Czech Republic
Contact:

Re: Change the background image of the page

Post by Jan » 06 Aug 2019, 14:50

Ok
If you find Phoca extensions useful, please support the project

Post Reply