Okay
  Public Ticket #2299291
Animated Underline
Closed

Comments

  • Oliver started the conversation

    Hello, please could you help answer these two questions:

    1) How do I remove the animated underline from the off canvas menu? I have selected the option under Header Navigation > Animation Effects. I have also emptied the cache and it still won't go.

    2) How to I increase the header padding for mobile only?

  •  3,022
    Andrew replied

    Hi Oliver,

    Use the following custom css in Salient > General settings > CSS/Script related:

    body.material #slide-out-widget-area[class*="slide-out-from-right"] .off-canvas-menu-container li a:hover:after {
        display: none !important;
    }
    

    Try the following to increase header padding on mobile:

    @media only screen and (max-width: 768px){
        #header-outer {
        padding: 30px 20px !important;
    }
    }
    

    Hope this helps.

  • Oliver replied

    Hi Andrew,

    Thanks for your help. The CSS for the Head Padding worked!

    The other one is almost there... the underline doesn't show when hovering... but it still shows when active. Please could you help remove the underline when active?

    On a separate issue... is it possible to move the social icons in the off-canvas menu DOWN below the "off-canvas menu text"? If this isn't possible, is there a way to remove the social icons completely? I've got this option deselected, but it is not responding.

    Thanks in advance!

  •  3,022
    Andrew replied

    Hi Oliver,

    Try the following:

    body.material #slide-out-widget-area[class*="slide-out-from-right"] .off-canvas-menu-container li a:after, #slide-out-widget-area .tagcloud a:hover{
        display:none;
    }
    

    Hope this helps.

  • Oliver replied

    Hi Andrew,

    That worked a treat - thank you!

    Any luck with the other issue of removing the social icons from the off-canvas menu on mobile?

  •  3,022
    Andrew replied

    Hi Oliver,

    Use the following:

    @media only screen and (max-width: 768px){
        ul.off-canvas-social-links.mobile-only {
        display: none !important;
    }
    }
    

    Kind regards.

  • Oliver replied

    THANKS SO MUCH!