JSFiddle - React, Tailwind, and code Playground

by adamschwartz

HTML

<a class="hovered-underline" href="http://example.com">Example link</a>

<br>
    
<a href="http://example.com">Example link</a>

CSS

a {
  font-size: 100px;
}

a.hovered-underline {
    text-decoration: none
}

a.hovered-underline:hover {
    font-size: 100px;
    text-decoration: underline
}

a.smart-underlined:hover {
    text-decoration: none !important;
    color: green !important
}

CoffeeScript

$('a')
  .mouseover ->
    if getComputedStyle(@).textDecoration is 'underline'
      $(@).addClass('smart-underlined')