diff options
| -rw-r--r-- | scss/_utilities.scss | 1 | ||||
| -rw-r--r-- | site/content/docs/5.3/utilities/link.md | 5 |
2 files changed, 4 insertions, 2 deletions
diff --git a/scss/_utilities.scss b/scss/_utilities.scss index e1191f146..6f1b306b3 100644 --- a/scss/_utilities.scss +++ b/scss/_utilities.scss @@ -651,6 +651,7 @@ $utilities: map-merge( class: link-underline-opacity, state: hover, values: ( + 0: 0, 10: .1, 25: .25, 50: .5, diff --git a/site/content/docs/5.3/utilities/link.md b/site/content/docs/5.3/utilities/link.md index 2baebf9e2..1b8eaa1ef 100644 --- a/site/content/docs/5.3/utilities/link.md +++ b/site/content/docs/5.3/utilities/link.md @@ -59,6 +59,7 @@ Change the underline's distance from your text. Offset is set in `em` units to a Change the underline's opacity. Requires adding `.link-underline` to first set an `rgba()` color we use to then modify the alpha opacity. {{< example >}} +<p><a class="link-offset-2 link-underline link-underline-opacity-0" href="#">Underline opacity 0</a></p> <p><a class="link-offset-2 link-underline link-underline-opacity-10" href="#">Underline opacity 10</a></p> <p><a class="link-offset-2 link-underline link-underline-opacity-25" href="#">Underline opacity 25</a></p> <p><a class="link-offset-2 link-underline link-underline-opacity-50" href="#">Underline opacity 50</a></p> @@ -71,8 +72,8 @@ Change the underline's opacity. Requires adding `.link-underline` to first set a Just like the `.link-opacity-*-hover` utilities, `.link-offset` and `.link-underline-opacity` utilities include `:hover` variants by default. Mix and match to create unique link styles. {{< example >}} -<a class="link-offset-2 link-offset-3-hover link-underline link-underline-opacity-25 link-underline-opacity-75-hover" href="#"> - Underline opacity 10 +<a class="link-offset-2 link-offset-3-hover link-underline link-underline-opacity-0 link-underline-opacity-75-hover" href="#"> + Underline opacity 0 </a> {{< /example >}} |