Canvas logo location

[chojo]

Hi @Russ,
Hope you are well.

On Canvas layout, is it possible via an option to get the Logo centered? So basicly swapping Logo position with Search and then centered the Logo position?

Thanks

 

[Russ]

Hello, doing well thank you!

This might get you headed in the right direction, add this to your extra.less:

@media (min-width: (@xf-responsiveWide  + 1))
{
    .xb-canvas .canvas-header
    {
        .p-header-logo
        {
            order: 2;
            margin: 0 auto;
        }
        .xb-searchWrapper
        {
            order: 1;
            margin-right: 0;
        }
        .p-nav-opposite
        {
            order: 3;
            margin-left: 0;
        }
    }
}

This only changes it when the side-canvas is active and goes back to the default logo on the left side at the "wide" resolution. You might need to change the background colors on it which you can add like the background transparent on the logo or whatever color you want. By default our logo in the canvas has a background which is why I mention this.

@media (min-width: (@xf-responsiveWide  + 1))
{
    .xb-canvas .canvas-header
    {
        .p-header-logo
        {
            order: 2;
            margin: 0 auto;
          background: transparent;
        }
        .xb-searchWrapper
        {
            order: 1;
            margin-right: 0;
        }
        .p-nav-opposite
        {
            order: 3;
            margin-left: 0;
        }
    }
}