[Resolved] Off Canvas Panel – Logo Centered On Top

Home Forums Support Off Canvas Panel – Logo Centered On Top

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #1352818
    Omar

    Hello there, I followed the instructions at this topic

    It is working fine except for the alignment and size of the logo. as it is stuck to the right of the off-canvas menu. add to the all the menu items in RTL is aligned to the left.

    try to change the text-align at the following code, it is fixed in Arabic (RTL) but it is also applied to English at the same time.

    /* Off-canvas menu styles */
    .slideout-navigation.main-navigation .main-nav ul li a, .slideout-navigation button.slideout-exit {
        text-align: right;
    }
    #1352923
    Leo
    Staff
    Customer Support

    Hi there,

    Can you disable the caching plugin and Autopimize so I can take a closer look at the code?

    #1352999
    Omar

    Hi Leo,
    I disable all the cache plugin.

    #1353131
    Leo
    Staff
    Customer Support

    Try this:

    .inside-navigation .custom-logo-link {
        margin-left: auto;
        margin-right: auto;
    }
    #1353163
    Omar

    Thank you Leo, great it is working fine!

    But the menu are not aligned well duo to this code:

    /* Off-canvas menu styles */
    .slideout-navigation.main-navigation .main-nav ul li a, .slideout-navigation button.slideout-exit {
        text-align: right;
    }

    if a kept it “right” the RTL working fine and all the menu is set to right, but the LTR menu is also setting to the right and vice versa.

    #1354104
    Leo
    Staff
    Customer Support

    Sorry so what happens if you remove that code?

    #1354294
    Omar

    Hi

    The first image showing the mobile menu in the English language:

    English Menu
    it is not aligned well as it must be on the left side.

    Here, Arabic menu:
    Arabic Menu
    The items here looking well as it is aligned to the right except that the menu itself is on the left.

    Icons Alignment:
    Icons Alignment
    Icons are not arranged well

    #1354503
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Try this, instead:

    /* Off-canvas menu styles */
    .rtl .slideout-navigation.main-navigation .main-nav ul li a, 
    .rtl .slideout-navigation button.slideout-exit {
        text-align: right;
    }

    As for the menu bar, try this:

    .rtl .mobile-bar-items {
        position: relative;
    }
    
    .rtl .main-navigation:not(.slideout-navigation) .mobile-bar-items+.menu-toggle {
        text-align: right;
    }
    #1354592
    Omar

    Hi Tom,

    Amaizin, it is fixed! except for the slideout of the Off-Canvas menu. In both cases, it is stick on the left side.

    #1355493
    Tom
    Lead Developer
    Lead Developer

    For that, you can do this:

    add_filter( 'option_generate_menu_plus_settings', function( $settings ) {
        if ( is_rtl() ) {
            $settings['slideout_menu_side'] = 'right';
        }
    
        return $settings;
    } );
    #1368132
    Omar

    Thank you Tom, it has been solved.

    #1368828
    Tom
    Lead Developer
    Lead Developer
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.