plyr/src/less/components/embed.less
2017-11-06 20:27:19 +11:00

35 lines
844 B
Plaintext

// --------------------------------------------------------------
// Embedded players
// YouTube, Vimeo, etc
// --------------------------------------------------------------
.plyr__video-embed {
// Default to 16:9 ratio but this is set by JavaScript based on config
@padding: ((100 / 16) * 9);
@offset: unit((300 - @padding) / 6, ~'%');
padding-bottom: unit(@padding, ~'%');
height: 0;
iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0;
user-select: none;
}
// Vimeo hack
> div {
position: relative;
padding-bottom: 300%;
transform: translateY(-@offset);
}
}
// To allow mouse events to be captured if full support
.plyr--full-ui .plyr__video-embed iframe {
pointer-events: none;
}