[Support request] Separate menu css for sticky menu

Home Forums Support Separate menu css for sticky menu

This topic contains 3 replies, has 2 voices, and was last updated by  David 1 month ago.

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

    Harris

    Hello,

    I got this code using it in several sites altered, in order to underline active and hovered menu items in site’s primary navigation

    /* Menu underlining */
    
    @media (min-width: 767px) {
    
    .main-navigation .menu > .menu-item > a::after {
        content: "";
    	position: relative;
    	top: -35px;
    	opacity: 1;
        display: block;
        width: 0;
        border-bottom: 6px solid #ff8c3d;
        background-color: currentColor;
        transition: 0.3s width ease;
    }
    .main-navigation .menu > .menu-item.current-menu-item > a::after,
    .main-navigation .menu > .menu-item > a:hover::after {
        width: 50%;
    }

    Is there some was I can exclude the sticky navigation from that underlining? (underline applies in site navigation but not in sticky navigation)

    Thanks
    Harris

    #1257796

    David Customer Support

    Hi there,

    your first line of CSS – chage it to:

    .main-navigation:not(.is_stuck) .menu > .menu-item > a::after {

    #1257814

    Harris

    Thanks David!

    #1257835

    David Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.