Okay
  Public Ticket #1114564
WPML menu
Closed

Comments

  •  2
    urbanw started the conversation
    March 27, 2017 at 7:37pm

    Is there any way I could make the link decoration to behave like yours- Sliding from right to left?

    Currently it only shows a white bar and I wasn't able to customise it through WPML.

    Thanks a lot to point me in the right direction

  •  1,558
    Laborator replied
    March 28, 2017 at 12:23pm

    Hi there,

    Go to Custom CSS and add the following code to it:

    .wpml-ls-legacy-list-horizontal a {
    position: relative;
    display: inline-block;
    padding: 0px;
    margin-right: 15px
}
.wpml-ls-legacy-list-horizontal a:after {
    content: '';
    overflow: hidden;
    position: absolute;
    left: 0;
    bottom: -1px;
    display: block;
    width: 0%;
    height: 1px;
    background-color: #00b19e !important;
    -webkit-transition: all .3s cubic-bezier(.175,.885,.32,1.075);
    transition: all .3s cubic-bezier(.175,.885,.32,1.075);
}
.wpml-ls-legacy-list-horizontal a:hover:after {
    width: 100%;
}

    If you don't know how to add extra CSS in the Custom CSS area then follow our documentation articles.

    Best regards,
    Laborator Team

      Documentation         Join Kalium Users Group

  •  2
    urbanw replied
    March 28, 2017 at 2:09pm

    Hey thanks for helping me out here.

    I had to add 

    text-decoration: none !important;

    otherwise I had a "classic underline" and the moving underline at the same time...

    Best Urban

    .wpml-ls-legacy-list-horizontal a {
    position: relative;
    text-decoration: none !important;
    display: inline-block;
    padding: 0px;
    margin-right: 15px
}
  •  1,558
    Laborator replied
    March 28, 2017 at 2:27pm

    Glad to hear you managed to find out how to remove the other underline

    Best regards,
    Laborator Team

      Documentation         Join Kalium Users Group