aboutsummaryrefslogtreecommitdiffstats
path: root/src/less/components/captions.less
diff options
context:
space:
mode:
authorSam Potts <me@sampotts.me>2016-05-01 19:27:53 +1000
committerSam Potts <me@sampotts.me>2016-05-01 19:27:53 +1000
commitfad3f41ca7517ae14f8805f6c51e85dc6c47a4e7 (patch)
tree79df46c7fba88e6749d7f59815c54055d5293694 /src/less/components/captions.less
parent39a0a38d070c3c436b5f6b270b9d6406b0e43e06 (diff)
downloadplyr-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.less43
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