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

Omar Adil

Member
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
 
Solution
This seems to work for me (in extra.less}

Code:
@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}
}

hstammlerj

Active member
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?
 

Mr Lucky

Well-known member
This seems to work for me (in extra.less}

Code:
@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}
}
 
Solution

Omar Adil

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

Code:
@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
 
Top