contrast-links
($color)
Overrides all <a>
elements against the provided background $color
, only if necessary as defined by $lightness-threshold
config.
It uses $inverse-link-
values from _config.scss
.
These values provide for a generic link color inversion. If you need a more specific override, you should use set-link()
instead.
Important! This mixin only works at a parent level.
Parameters
$color
- Background-color to check
Example
.contrast-links {
background-color: $teal9;
@include contrast-links($teal9);
}
<div class="contrast-links">
<a href="/" > I'm a link </a><br>
<a href="/" > Me too! </a>
</div>