Link Type – Simple underline

Hello @wpbluefox,
Just to make sure we are on the same line, do you want to have a text-decoration: underline only on hover state?

Yes, correct.

Currently it is possible to control link color and link color hover state. Fine.
I would like to add text-decoration: underline only on hover state.

So link would be color: green (let’s say),
link hover would be color: grey; text-decoration: underline

That’s it.

Hello @wpbluefox,
Unfortunately at the moment we don’t have such a hover state behavior.

But here is how you can achieve this:

1. Select the Type 1 from here – https://tppr.me/a7tQh

2. Paste this CSS code in Customizer -> Additional CSS

.entry-content a {
	--linkInitialColor: green;
	--linkHoverColor: gray;
}

.entry-content a:hover {
	text-decoration: underline;
}

And here is the final result – https://d.pr/v/xH8uFw

Hope this helps ??

Hello @creativethemeshq,
This is what I thought and done.

But I found more classes:
.woocommerce-MyAccount-content
.entry-summary
.wp-block-button a:hover {text-decoration: none;}

And other classes included or excluded.

I thought you suggest something like:

[data-menu*="type-2"]>ul>li>a:after {
width: calc(105% - var(--menu-items-spacing, 25px));
margin: 0 auto;
}

Like you suggested for Menu items underline in a neighbour thread.

If you decide to add one more Link Type here https://prnt.sc/1tco23t in a future, that’s fine, I wait.

• This reply was modified 3 years, 2 months ago by Dmitry Bychenko.

Hello @wpbluefox,
I will note this in our to do list but I can’t promise if this links type will be added anytime soon simply because we have other more important tasks at the moment.

With some custom CSS you can achieve this easily, please try this snippet:

.entry-content p a,
.entry-summary p a,
.woocommerce-MyAccount-content a {
	--linkInitialColor: green;
	--linkHoverColor: gray;
}

.entry-content p a:hover,
.entry-summary p a:hover,
.woocommerce-MyAccount-content a:hover {
	text-decoration: underline;
}

Let me know if this helps.