Jump to content

Change Black text on black drop down menu to white in Forte template

Recommended Posts

Site URL: https://www.samuelprudden.com

On this website, I'm having an issue with the home page navigation. When first visiting the home page and hovering over "WORK", the black dropdown folder appears but the actual sub nav items are black as well with the link underline showing up in white. This doesn't happen on any other page when trying to navigate to WORK and when a viewer visits another page and then returns to the home page, the sub nav shows up in white. I'm trying to get the initial view on the home page to be white as well. I've included the styles currently being used in the Advanced Page Header Code Injection.  Can anyone help me resolve the issue? 

<style>
 body.collection-type-index .color-weight-dark  #topNav .folder .folder-child-wrapper ul.folder-child li a {
  color: #fff !important;
  }
</style>

<style>
 body.collection-type-index .color-weight-dark  #topNav .folder .folder-child-wrapper ul.folder-child li a {
  color: #fff !important;
  }
.collection-title
{
display: none;
}
</style>

<style>
  .collection-detail-wrapper 
  {
  display: none;
  }
</style>

<style>
 .logo a, .logo-subtitle, #topNav .main-nav li a, #sqs-social a, .sqs-use--icon, .sqs-use--mask, #topNav .folder .folder-child-wrapper .folder-child:before, #mobile-navigation a, .ctrl-button a {
    color: #000 !important;
 }
 </style>

<style>
#sqs-social .sqs-use--icon {
    fill: #000 !important;
}
</style>

<style>
 body.collection-type-index .color-weight-dark  #topNav .folder .folder-child-wrapper ul.folder-child {
    background-color: #000 !important;
}
</style>

 

Link to comment
  • Replies 5
  • Views 788
  • Created
  • Last Reply

Top Posters In This Topic

It would change for all page nav bars but you this is in design custom css, that is where I have mine. Changed the background from transparent to gray. I have no code to change the drop down anywhere else except to left justify the text in the box. 

#topNav .main-nav .folder-collection

.subnav ul { text-align: left;
 }

I use this to change the box color. I left the text color alone, it changes with header/sub title color style tweak. 

 

/* Change the navigation drop-downs background colour*/

 #topNav nav .folder-collection ul li a {
   background-color:#F4F4F4;
 }

https://myrandomviews.com/

 

Edited by derricksrandomviews
Link to comment
  • 1 year later...
On 2/10/2022 at 12:17 AM, Mani said:

I have the same issue. it works in the home page but not other page. I removed all of the codes and it still shows black background in other pages. Did you resolve this issue?

What is site url? We can check easier

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

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.