projectblacklight/blacklight

View on GitHub
app/assets/stylesheets/blacklight/_mixins.scss

Summary

Maintainability
Test Coverage
// Stroke contrast
// Ripped off from https://github.com/twbs/bootstrap/commit/c31d52499811d5c68d122db806ce27a112b489bd
@mixin fill-yiq($color) {
  $r: red($color);
  $g: green($color);
  $b: blue($color);

  $yiq: (($r * 299) + ($g * 587) + ($b * 114)) / 1000;

  @if ($yiq >= 150) {
    fill: #111;
  } @else {
    fill: #fff;
  }
}

// define a visually-hidden class that applies to a given breakpoint and below
// https://getbootstrap.com/docs/5.3/helpers/visually-hidden/
@if mixin-exists(visually-hidden) {
  @each $infix, $breakpoint in $grid-breakpoints {
    .visually-hidden-#{$infix} {
      @include media-breakpoint-down($breakpoint) {
        @include visually-hidden;
      }
    }
  }
} @else if mixin-exists(sr-only) {  // Bootstrap 4 version
  @each $infix, $breakpoint in $grid-breakpoints {
    .visually-hidden-#{$infix} {
      @include media-breakpoint-down($breakpoint) {
        @include sr-only;
      }
    }
  }
}