@use "sass:color";

@use "settings";

// Figure out the color of the "transparent" link underlines:
@function underline-hack($color, $background: #ffffff) {
  // Calculate underline color by mix()'ing it with a given background to give the impression of opacity but with much
  // better efficiency and compatibility.
  $color-transparentized: color.mix($color, $background, settings.$link-underline-opacity);

  // Return a "gradient" as a hack to get the fancy underline to wrap:
  // https://www.dannyguo.com/blog/animated-multiline-link-underlines-with-css/
  @return linear-gradient($color-transparentized, $color-transparentized);
}