Fork me on GitHub

Compass Fluid Video

Installation

gem install compass-fluid-video

The only requirement of this plugin is that your wrap your video inside a container, like so:

<div class="video-container">
    <!-- video code here -->
</div>

Next, import the compass-fluid-video extension and then include it inside your container class.

@import 'compass-fluid-video';

.video-container {
    @include fluid-video;
}

Examples

HTML5

Vimeo

YouTube

Custom Dimensions

For a custom size video, simply provide desired ratio dimensions (width, height) and the video will be scaled automagically.

.custom {
    @include fluid-video($width: 500, $height: 214);
    // shorthand syntax:
    // @include fluid-video(500, 214);
}