[Resolved] Off Canvas Panel Switching Sides Desktop and Mobile

Home Forums Support Off Canvas Panel Switching Sides Desktop and Mobile

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1060106
    Joe

    Hi there.

    Is this possible for the Off Canvas Panel?

    On the desktop, the hamburger is on the left so the panel slides in from the left. As needed.

    Yet on the mobile, the hamburger is on the right so better CX would be to have it slide in from the right (mobile only).

    Is it possible to set the direction based on the device?

    Thanks,
    Joe

    #1060400
    David
    Staff

    Hi there,

    try this CSS:

    @media (max-width: 768px) {
        .offside--left {
            left: auto;
            right: -265px;
        }
    
        .offside--left.is-open,
        .offside-js--is-left .offside-sliding-element {
            -webkit-transform: translate3d(-265px, 0, 0);
            -moz-transform: translate3d(-265px, 0, 0);
            -ms-transform: translate3d(-265px, 0, 0);
            -o-transform: translate3d(-265px, 0, 0);
            transform: translate3d(-265px, 0, 0);
        }
    
        .offside-js--is-left.slide-opened .slideout-overlay button.slideout-exit {
            left: unset;
            right: 260px;
        }
    }
    #1060809
    Joe

    Like a charm. Thank you!

    #1060857
    David
    Staff
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.