Change of color of drop down menu for tablet/mobile views

• 

  trippostapp · Member · Mar 29, 2017 at 8:17 pm

  • Copy link
  • Add topic to favorites

  Hello!

  I need help changing the color of the menu selector in the aperitive theme on my website http://www.trippostapp.com for tablet/mobile views. Currently I have the header background to white so it would look better while scrolling. But the menu items and menu button is white. I want to change it to #134452. Any help for poor little me? (:

  Best,

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Mar 30, 2017 at 8:02 am

  • Copy link

  This will take care of the menu icon and the menu item text.

  @media screen and (max-width: 1024px) {
  body:not(.header-scrolled) #site-navigation:not(.toggled) .menu-toggle span, body:not(.header-scrolled) #site-navigation:not(.toggled) .menu-toggle span, body:not(.header-scrolled) #site-navigation:not(.toggled) .menu-toggle span::before, body:not(.header-scrolled) #site-navigation:not(.toggled) .menu-toggle span::after {
  	background-color: #134452 !important;
  }
  .main-navigation li a {
  	color: #134452;
  }
  .toggled .menu-toggle span:before, .toggled .menu-toggle span:after {
  	background-color: #134452;
  }
  }

• 

  trippostapp · Member · Mar 30, 2017 at 6:34 pm

  • Copy link

  Thank you so much! @thesacredpath, do you happen to know what I’d input if I want the menu button to be #134452 while scrolling down as well? It still shows as #fff on the mobile and tablet screens.

• 

  thesacredpath · Member · Mar 31, 2017 at 3:09 am

  • Copy link

  My goodness, Aperitive is sneaky. Add the following to the bottom of your custom CSS.

  .menu-toggle span, .menu-toggle span::before, .menu-toggle span::after, .toggled .menu-toggle span::before, .toggled .menu-toggle span::after {
  	background-color: #134452;
  }

• 

  trippostapp · Member · Apr 10, 2017 at 10:05 pm

  • Copy link

  Thank you so much!

• 

  thesacredpath · Member · Apr 11, 2017 at 5:09 am

  • Copy link

  You are welcome.