Skip to content
GitLab

Move hovered badge's text-decoration CSS to base styles

Merged Administrator requested to merge github/fork/ysds/badge-hover-underline into v4-dev

Created by: ysds

Each color does not need to have the text-decoration CSS. It should be defined in the base styles.

This change greatly expands color flexibility:

image

<a href="#" class="badge text-white bg-primary">Primary</a>
<a href="#" class="badge text-primary bg-transprent border border-primary">Outlined</a>
<a href="#" class="badge text-white" style="background-color: #1dcaff">Twitter</a>
<a href="#" class="badge text-white" style="background-color: #3b5998">Facebook</a>
<a href="#" class="badge text-white" style="background-color: #563d7c">Bootstrap</a>
<a href="#" class="badge text-white" style="background-color: #563D7C">css</a>
<a href="#" class="badge text-body" style="background-color: #FFC40D">js</a>

Demo: https://codepen.io/anon/pen/bxBBZa

Related: #23886, #27136 and the comment in the v5 ideas:

Improve components by removing all their most commonly overridden properties, thus relying more on utilities. ...