FIX: Enforce a fixed height on generic oneboxed videos

FIX: Enforce a fixed height on generic oneboxed videos

This prevents ‘jumping’ as the video loads. This change will require posts to be rebaked before it takes effect.

diff --git a/Gemfile b/Gemfile
index 88d2c4f..7184bbc 100644
--- a/Gemfile
+++ b/Gemfile
@@ -36,7 +36,7 @@ gem 'redis-namespace'
 
 gem 'active_model_serializers', '~> 0.8.3'
 
-gem 'onebox', '1.8.73'
+gem 'onebox', '1.8.74'
 
 gem 'http_accept_language', '~>2.0.5', require: false
 
diff --git a/Gemfile.lock b/Gemfile.lock
index 88e2d49..9ecacd4 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -258,7 +258,7 @@ GEM
     omniauth-twitter (1.4.0)
       omniauth-oauth (~> 1.1)
       rack
-    onebox (1.8.73)
+    onebox (1.8.74)
       htmlentities (~> 4.3)
       moneta (~> 1.0)
       multi_json (~> 1.11)
@@ -512,7 +512,7 @@ DEPENDENCIES
   omniauth-oauth2
   omniauth-openid
   omniauth-twitter
-  onebox (= 1.8.73)
+  onebox (= 1.8.74)
   openid-redis-store
   pg
   pry-nav
diff --git a/app/assets/stylesheets/common/base/onebox.scss b/app/assets/stylesheets/common/base/onebox.scss
index 6832098..2a9eaa8 100644
--- a/app/assets/stylesheets/common/base/onebox.scss
+++ b/app/assets/stylesheets/common/base/onebox.scss
@@ -565,3 +565,16 @@ aside.onebox.stackexchange .onebox-body {
 .onebox.google-photos-album {
   @extend .imgur-album;
 }
+
+// Force oneboxed videos to 16:9 aspect ratio
+.onebox.video-onebox {
+  position: relative;
+  padding: 0 0 56.25% 0;
+  width: 100%;
+
+  video {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+  }
+}

GitHub sha: fe20cb4b

2 Likes