diff options
author | Sam Potts <me@sampotts.me> | 2016-05-01 19:27:53 +1000 |
---|---|---|
committer | Sam Potts <me@sampotts.me> | 2016-05-01 19:27:53 +1000 |
commit | fad3f41ca7517ae14f8805f6c51e85dc6c47a4e7 (patch) | |
tree | 79df46c7fba88e6749d7f59815c54055d5293694 /src/less/components/captions.less | |
parent | 39a0a38d070c3c436b5f6b270b9d6406b0e43e06 (diff) | |
download | plyr-fad3f41ca7517ae14f8805f6c51e85dc6c47a4e7.tar.lz plyr-fad3f41ca7517ae14f8805f6c51e85dc6c47a4e7.tar.xz plyr-fad3f41ca7517ae14f8805f6c51e85dc6c47a4e7.zip |
Prep work for theming
Diffstat (limited to 'src/less/components/captions.less')
-rw-r--r-- | src/less/components/captions.less | 43 |
1 files changed, 43 insertions, 0 deletions
diff --git a/src/less/components/captions.less b/src/less/components/captions.less new file mode 100644 index 00000000..83c436c2 --- /dev/null +++ b/src/less/components/captions.less @@ -0,0 +1,43 @@ +// Captions +// -------------------------------------------------------------- + +// Hide default captions +.plyr video::-webkit-media-text-track-container { + display: none; +} +.plyr__captions { + display: none; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + padding: (@plyr-control-spacing * 2); + transform: translateY(-(@plyr-control-spacing * 6)); + transition: transform .3s ease; + color: #fff; + font-size: @plyr-font-size-captions-base; + text-align: center; + font-weight: 400; + + span { + border-radius: 2px; + padding: floor(@plyr-control-spacing / 3) @plyr-control-spacing; + background: fade(#000, 85%); + } + span:empty { + display: none; + } + + @media (min-width: @plyr-bp-screen-md) { + font-size: @plyr-font-size-captions-medium; + } +} +.plyr--captions-active .plyr__captions { + display: block; +} +.plyr--fullscreen-active .plyr__captions { + font-size: @plyr-font-size-captions-large; +} +.plyr--hide-controls .plyr__captions { + transform: translateY(-(@plyr-control-spacing * 2)); +}
\ No newline at end of file |