[Support request] Off canvas focus

Home Forums Support Off canvas focus

  • This topic has 18 replies, 3 voices, and was last updated 7 months ago by Tom.
Viewing 4 posts - 16 through 19 (of 19 total)
  • Author
    Posts
  • #1222638
    Steven

    It seems to have improved some. Focus is given to the overlay now. However, when moving through the menu, it eventually continues on to the page content instead of returning back to the top for the close menu link.

    I thin the search is also experiencing something similar. When the search icon is selected by pressing the enter key, the search box isn’t visible and doesn’t appear to have focus.

    #1222639
    Tom
    Lead Developer
    Lead Developer

    Yea, that’s a tough one, as it involves trapping the focus inside the overlay. The user can press esc to get out of there, but I’ll see if I can figure out how to trap the focus.

    Navigation search looks like a GP issue – the focus styling should remain as long as the search is open. Ideally, the color of the input would be different from the background, which would prevent this.

    Right now you’re using this CSS:

    .navigation-search input[type="search"]:focus {
        box-shadow: 0 0 5px rgba(81, 203, 238, 1);
        padding: 3px 0px 3px 3px;
        margin: 5px 1px 3px 0px;
        border: 1px solid rgba(81, 203, 238, 1);
    }

    Try this:

    .nav-search-active input[type="search"],
    .navigation-search input[type="search"]:focus {
        box-shadow: 0 0 5px rgba(81, 203, 238, 1);
        padding: 3px 0px 3px 3px;
        margin: 5px 1px 3px 0px;
        border: 1px solid rgba(81, 203, 238, 1);
    }
    #1222646
    Steven

    Thanks for the CSS tweak. That appears to have resolved the search box display issue 😉

    #1222647
    Tom
    Lead Developer
    Lead Developer

    Awesome – glad the focus issue is fixed in the overlay as well.

    I’ll research the focus trapping 🙂

Viewing 4 posts - 16 through 19 (of 19 total)
  • You must be logged in to reply to this topic.