SU-SWS/decanter

View on GitHub
core/src/scss/utilities/mixins/display/_embed-container.scss

Summary

Maintainability
Test Coverage

///
/// Responsive embed container to ensure that contents scale to the
/// width of parent element while retaining an aspect ratio of 16:9.
///
/// @name embed-container
///
/// @param {number} $height  - height in pixel integers
/// @param {number} $width   - width in pixel integers
///
/// @group mixin
@mixin embed-container($height, $width) {
  @include padding(null null percentage($height / $width));
  position: relative;
  height: 0;
  overflow: hidden;
  max-width: 100%;

  iframe,
  object,
  embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}