X3Photo Gallery Forums

ClaudioMaffucci · 24 Mar 2018, 05:48

Hi,

I'm using the below modification in Custom CSS for all of the menu, when they are actives.

body[class*='topbar'] .menu>li>a.active {
background: #455e25 !important;
color: gold !important;
}

Now I want to use another background color (transparent) only for the index page. The idea is duplicate it and modify as below (maybe with my-index-page) and connect it only to the index page.

.my-index-page body[class*='topbar'] .menu>li>a.active {
background: transparent !important;
color: gold !important;
}

Can somebody support and tell me how to approach the modification and how to connect to the page?

Thank you in advance for any support.
Regards,
Claudio

24 Mar 2018, 13:13

Since the class for the page is defined inside the <body> tag, it would have to look like this:

body.page-index[class*='topbar'] .menu>li>a.active

"page-index" is the default page class for the index page. You could of course use another class, if you have assigned a custom body class to the page. Things are quite complicated with the menu (as you can see), since there are multiple layouts, and multiple states (static, fixed and overlay).

ClaudioMaffucci · 24 Mar 2018, 13:38

Hi,
thank you for your quickly reply. Your suggestion/support works perfectly.
Thank you again and have a nice weekend.
Regards,
Claudio

X3Photo Gallery Forums

Menu background color3 posts

Menu background color

Re: Menu background color

Re: Menu background color