PHP Classes

File: engine/modules/contrib/foundation/source/scss/components/_responsive-embed.scss

Recommend this page to a friend!
  Classes of Aldo Tripiciano   Quanta CMS   engine/modules/contrib/foundation/source/scss/components/_responsive-embed.scss   Download  
File: engine/modules/contrib/foundation/source/scss/components/_responsive-embed.scss
Role: Auxiliary data
Content type: text/plain
Description: Auxiliary data
Class: Quanta CMS
Manage content that works without a database
Author: By
Last change:
Date: 5 years ago
Size: 1,771 bytes
 

Contents

Class file image Download
// Foundation for Sites by ZURB // foundation.zurb.com // Licensed under MIT Open Source //// /// @group responsive-embed //// /// Margin below a responsive embed container. /// @type Number $responsive-embed-margin-bottom: rem-calc(16) !default; /// Aspect ratios used to determine padding-bottom of responsive embed containers. /// @type Map $responsive-embed-ratios: ( default: 4 by 3, widescreen: 16 by 9, ) !default; /// Creates a responsive embed container. /// @param {String|List} $ratio [default] - Ratio of the container. Can be a key from the `$responsive-embed-ratios` map or a list formatted as `x by y`. @mixin responsive-embed($ratio: default) { @if type-of($ratio) == 'string' { $ratio: map-get($responsive-embed-ratios, $ratio); } position: relative; height: 0; margin-bottom: $responsive-embed-margin-bottom; padding-bottom: ratio-to-percentage($ratio); overflow: hidden; iframe, object, embed, video { position: absolute; top: 0; #{$global-left}: 0; width: 100%; height: 100%; } } @mixin foundation-responsive-embed { .responsive-embed, .flex-video { @include responsive-embed($ratio: default); $ratios: map-remove($responsive-embed-ratios,default); @each $name, $ratio in $ratios { &.#{$name} { padding-bottom: ratio-to-percentage($ratio); } } } } @mixin foundation-flex-video { @warn 'This mixin is being replaced by foundation-responsive-embed(). foundation-flex-video() will be removed in Foundation 6.4.'; @include foundation-responsive-embed; } @mixin flex-video($ratio: $responsive-embed-ratio) { @warn 'This mixin is being replaced by responsive-embed(). flex-video() will be removed in Foundation 6.4.'; @include responsive-embed; }