Docs

[carringtontech]

I have a very simple NavBar with 3 links arranged horizontally. I want to disable the mobile nav button functionality so that on a mobile device I just see the standard NavBar. I’m using Integrity Stack, NavBar position Fixed Top.

Really the only difference I’d like to see between the desktop and mobile sites, as far as my NavBar is concerned, is that I don’t want the mobile site’s NavBar to be “sticky” at the top of the mobile page when it scrolls.

Is this possible with X?

[Rue Nel]

Hello There,

Thanks for writing in! Of course , it is possible. To do that, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

@media (max-width: 979px){
  .masthead-stacked .x-btn-navbar,
  .masthead-inline .x-btn-navbar,
  .masthead .x-nav-wrap.mobile {
    display: none !important;
  }

  .x-navbar-inner {
      height: auto;
      min-height: 10px;
  }
    
  .masthead .x-nav-wrap.desktop {
      display: block;
  }

  .x-navbar .desktop .x-nav > li > a:not(.x-btn-navbar-woocommerce) {
      padding: 10px 5px;
  }

  .x-navbar .desktop .x-nav > li > a {
      height: auto !important;
  }
}

We would loved to know if this has work for you. Thank you.

[Author]

Posts