Jump to content

Navigation menu in wrong colour after changing code (mobile)

Recommended Posts

Hi there,

 

I have a single page that I have been slowly editing to look different from the rest of the template on my website:

 

www.arthurlaidlaw.com/portfolio

 

The page background is white, unlike the rest of the site (where it's black). The template (Forte, 7.0) says that the navigation menu and logo should change colour according to whatever the background is, but in practice that doesn't happen. I've editing the background colour site wide or using collection IDs through the Custom CSS editor in the Design tab and in the page header, but with no success. Instead I had to upload an image and embed it within the individual page header, which seems to be working well.

 

In order to change colour of the navigation bar and logo, I used the following code:

 

 .logo a, .logo-subtitle, #topNav .main-nav li a, #topNav .folder .folder-child-wrapper .folder-child:before, #mobile-navigation a, .ctrl-button a {
    color: black;
}

 

This worked well, and I was nearly satisfied – the menu text across the top of the page is black and easily legible. It is also excluding to the /portfolio page, and doesn't affect any other pages. 

 

However, when I went to view the site on mobile, and clicked the menu hamburger, the frame is also black, meaning the dropdown text is invisible. Does anyone know what I can do to change this?

 

My second question is less essential, but would still be nice. I was wondering if it's possible to link the images on the page, so that when you click on one to view it in a Lightbox, you could simply click on the left/right of the page or use a left/right arrow key to navigate to the next image on the page?

 

Thanks in advance for you help

 

 

IMG_5904.PNG

IMG_5903.PNG

Link to comment
  • Replies 4
  • Views 638
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.