XF 2.2 how to prevent the navbar change to side in small width

[Omar Adil]

hello guys
is there a way to deactivate the navbar change to side in mobile view (small width), because I only have two tabs for now which the space is enough for it, so I want to make the navbar the same as the desktop view
thank you

 

[hstammlerj]

I understand:

What needs to be done to keep the navbar always in desktop mode (worst case, but accepted: partly hidden by the right side's user elements) and to prevent the switch to hamburger button / folding menu at small viewports below responsive width / in mobile mode without losing all other still wanted responsive features?

 

[Omar Adil]

exactly dear

 

[bzcomputers]

Try this in your extra.less template:

@media (max-width: 250px)
.has-js .p-nav-inner {
    min-height: 45px;
}

 

[Mr Lucky]

This seems to work for me (in extra.less}

@media (max-width: @xf-publicNavCollapseWidth)
{
    .has-js
    {
       

        .p-nav .p-nav-menuTrigger
        {
            display: none;
        }

        .p-nav-smallLogo
        {
          
            margin-left:3px
        }

        .p-nav-scroller
        {display:block;
        }
    }

//optional to make visitor menu narrower

    .p-navgroup-link

{padding:8px 2px}
}

 

[Omar Adil]

This seems to work for me (in extra.less}

@media (max-width: @xf-publicNavCollapseWidth)
{
    .has-js
    {
      

        .p-nav .p-nav-menuTrigger
        {
            display: none;
        }

        .p-nav-smallLogo
        {
         
            margin-left:3px
        }

        .p-nav-scroller
        {display:block;
        }
    }

//optional to make visitor menu narrower

    .p-navgroup-link

{padding:8px 2px}
}

work perfect thank you very much
can you please help me if I want to down the navbar menu?
so the first row will contain the logo and the visitor menu
second row will contain the navbar menu
to benefit from the horizontal space taken by the logo image
thank you very much

 

[Omar Adil]

Try this in your extra.less template:

@media (max-width: 250px)
.has-js .p-nav-inner {
    min-height: 45px;
}

I'm sorry it is not working for me
thank you