Vimeo fix

4 files changed, 12 insertions, 5 deletions

diff --git a/src/sass/components/embed.scss b/src/sass/components/embed.scss
index b5d464f6..d9349052 100644
--- a/src/sass/components/embed.scss
+++ b/src/sass/components/embed.scss
@@ -7,10 +7,10 @@
     // Default to 16:9 ratio but this is set by JavaScript based on config
     $padding: ((100 / 16) * 9);
     $height: 200;
-    $offset: percentage(($height - $padding) / ($height / 50));
+    $offset: to-percentage(($height - $padding) / ($height / 50));
 
     height: 0;
-    padding-bottom: percentage($padding);
+    padding-bottom: to-percentage($padding);
 
     iframe {
         border: 0;
@@ -24,7 +24,7 @@
 
     // Vimeo hack
     > div {
-        padding-bottom: percentage($height);
+        padding-bottom: to-percentage($height);
         position: relative;
         transform: translateY(-$offset);
     }
diff --git a/src/sass/lib/functions.scss b/src/sass/lib/functions.scss
new file mode 100644
index 00000000..a99a1b80
--- /dev/null
+++ b/src/sass/lib/functions.scss
@@ -0,0 +1,7 @@
+// ==========================================================================
+// Useful functions
+// ==========================================================================
+
+@function to-percentage($input) {
+    @return $input * 1%;
+}
diff --git a/src/sass/lib/mixins.scss b/src/sass/lib/mixins.scss
index 67734701..59b693cf 100644
--- a/src/sass/lib/mixins.scss
+++ b/src/sass/lib/mixins.scss
@@ -1,6 +1,5 @@
 // ==========================================================================
-// Plyr mixins
-// https://github.com/sampotts/plyr
+// Mixins
 // ==========================================================================
 
 // Nicer focus styles
diff --git a/src/sass/plyr.scss b/src/sass/plyr.scss
index c6dd3678..2a01a561 100644
--- a/src/sass/plyr.scss
+++ b/src/sass/plyr.scss
@@ -19,6 +19,7 @@
 @import 'settings/tooltips';
 
 @import 'lib/animation';
+@import 'lib/functions';
 @import 'lib/mixins';
 
 @import 'base';