Support » Theme: Customizr » How to change color of animated underline effect on link hover

  • Resolved ronermarcelo

    (@ronermarcelo)


    Hello everybody!

    I want to change color of the animated underlink links effect on modern style.

    My site is hosted on a local development server so I linked this thread to customizr demo site.

    Documentation of Customizr shows how to turn on or turn off this effect, but I need to change color of this effect.

    I want this bar highlighted by red arrows on link above to show a different color. Demo site shows a bar in #313131 color but I need this bar in #e82eb3, for instance.

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • AddWeb Solution Pvt. Ltd.

    (@addweb-solution-pvt-ltd)

    Hello ronermarcelo,

    Add below css code into your current active child theme’s style.css file or you can add additional css option in theme customizer

    .czr-link-hover-underline [class*=nav__menu] .nav__title:before {
        background-color: #e82eb3;
    }

    Hope this will helps you.

    Thanks.

    Thank you @addweb-solution-pvt-ltd.

    I`ll try your solution.

    I was just posting that I found how to with this piece of css:

    .nav__title::before {
        background-color: #ff19d1 !important ;
    }
    • This reply was modified 1 year, 5 months ago by ronermarcelo.

    It worked!

    Now I need to discover how to change this color just to some menu itens, to highlight this specific menu itens.

    Thank you.

    I get it!

    This piece of css done the job for me:

    .czr-link-hover-underline [id*=menu-item-92] .nav__title:before {
        background-color: #e82eb3;
    }

    Thank you once more @addweb-solution-pvt-ltd.

    • This reply was modified 1 year, 5 months ago by ronermarcelo.

    marking this thread as resolved.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘How to change color of animated underline effect on link hover’ is closed to new replies.