[Resolved] Off canvas panel position

Home Forums Support [Resolved] Off canvas panel position

Home Forums Support Off canvas panel position

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1626861
    Bernhard

    Hello,
    I added

    body .offside--left {
        margin-top: 85px;
    }

    to fix the off canvas menu below the toggle. The problem is, that it sticks there when scrolling up and the menu items in the bottom in some viewing conditions are not shown.

    I think, it would be good to have the off canvas menu (when open) scrolling up together with the secondary navigation and the toggle and then stick to the top of the page. Is this possible?

    #1627623
    David
    Staff
    Customer Support

    Hi there,

    try adding some margin to the bottom of the menu with this CSS:

    .slideout-navigation .main-nav {
        margin-bottom: 120px !important;
    }
    #1628000
    Bernhard

    OK, thank you. I have added the margin-bottom.

    In the test, I took out the margin-top and set the close button outside. Now the toggle and the label shall disappear behind the slideout menu and the close button shall go down some px and be resized 1.4em bold.

    #1628571
    Elvin
    Staff
    Customer Support

    Hi there,

    To make the toggle go behind the slideout menu, add this:

    #generate-slideout-menu {
        z-index: 100002;
    }

    For the close button to go down, add this:

    .offside-js--is-left.slide-opened .slideout-overlay button.slideout-exit {
        font-size: 1.4em;
        margin-top: 20px;
    }

    Increase the margin-top value for it to go down further.

    As for thickness of the close button, font-weight won’t work because it’s using SVG rather than a font file.

    If you want to change its thickness, you’ll have to get a new SVG file with a thicker X close icon and use it in place of the default SVG icon for the close button.

    You can do that using Tom’s code here:
    https://generatepress.com/forums/topic/change-slideout-exit-icon/#post-1230639

    A wise man once said:
    "Have you cleared your cache?"

    #1629132
    Bernhard

    Hello,
    the close button is ok now but the menu toggle is still in front of the slideout menu.

    #1629791
    Tom
    Lead Developer
    Lead Developer

    That’s due to this custom CSS in your child theme:

    .menu-bar-item.slideout-toggle {
        z-index: 100002;
    }

    If you remove it, the menu toggle will be behind the off-canvas panel.

    #1629819
    Bernhard

    Perfect, thank you ๐Ÿ™‚ .

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