Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Mobile Navigation Menu Help


Question

Site URL: https://harmonica-pike-dxz2.squarespace.com/

Site Password: Twilight450

Hey everyone,

I'm currently experiencing a bit of an issue with the mobile version of my site. As you can see in the attached image, the nav menu is semi-transparent and shows a lot of the background of the website, instead of being 100% opacity and covering the background like I want. I believe this is because the color scheme I'm using has 50% opacity on the background color, but I can't find an option for mobile specifically. Is there a work around for mobile specifically? My client and I really enjoy the darker blue background color we get from the 50% opacity option, but this mobile nav is obviously unusable.

Thanks in advance! 

mobile example.JPG

Link to post
  • Answers 3
  • Created
  • Last Reply

Top Posters For This Question

Popular Days

Top Posters For This Question

Posted Images

3 answers to this question

Recommended Posts

  • 0

Hey @DanielLucasDesigns! I just took a look and the menu is full color for me over here 😕 maybe something just got stuck in the code and you just need to "turn it off and back on again" aka reload the site builder page? If the problem still persists, you can add this code to force the open menu to be full color: 
 

.header--menu-open .header-menu.black-bold .header-menu-bg {background-color: #266880!important; opacity:1!important;}

 

current view.png

Code queen and CSS behind InsideTheSquare.co

😃 Free CSS tutorials: insidethesquare.co/tutorials-for-squarespace
🥳 Free 7.1 training course: itssevenone.com/training
👍 CSS Cheat Sheet - codes for 7 & 7.1: insidethesquare.co/css
📚 CSS for Squarespace course: customcodeacademy.com

Link to post
  • 0
26 minutes ago, inside_the_square said:

Hey @DanielLucasDesigns! I just took a look and the menu is full color for me over here 😕 maybe something just got stuck in the code and you just need to "turn it off and back on again" aka reload the site builder page? If the problem still persists, you can add this code to force the open menu to be full color: 
 


.header--menu-open .header-menu.black-bold .header-menu-bg {background-color: #266880!important; opacity:1!important;}

 

current view.png

Hey there! Sorry I was playing around on the back end and made it full opacity to see if I could do anything with the code from one of your videos haha

 

It should be fully transparent now as it was before. I tried combining some of the coding from your latest video while adding in "-background-overlay:opacity 1!important)" but no change.

Link to post
  • 0
30 minutes ago, inside_the_square said:

Hey @DanielLucasDesigns! I just took a look and the menu is full color for me over here 😕 maybe something just got stuck in the code and you just need to "turn it off and back on again" aka reload the site builder page? If the problem still persists, you can add this code to force the open menu to be full color: 
 


.header--menu-open .header-menu.black-bold .header-menu-bg {background-color: #266880!important; opacity:1!important;}

 

current view.png

I have since changed "Black Bold" back to "Accent Dark", which is pictured in the screen shot. Does that change the code any? The code you sent I've copied and pasted, saved and refreshed, but no changes unfortunately. 

Link to post

Create an account or sign in to comment

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


×
×
  • Create New...