From 17584bca5e1980273f784f1a7f60f9decaf98d92 Mon Sep 17 00:00:00 2001
From: Arpit Jalan <arpit@techapj.com>
Date: Fri, 23 Mar 2018 17:35:17 +0530
Subject: [PATCH] UX: wrap full-size Twitter onebox images in aspect-ratio

---
 lib/cooked_post_processor.rb | 3 +--
 lib/twitter_api.rb           | 7 ++-----
 2 files changed, 3 insertions(+), 7 deletions(-)

diff --git a/lib/cooked_post_processor.rb b/lib/cooked_post_processor.rb
index 85fea1a1844..05d5924753e 100644
--- a/lib/cooked_post_processor.rb
+++ b/lib/cooked_post_processor.rb
@@ -447,8 +447,7 @@ class CookedPostProcessor
           new_parent = img.add_next_sibling("<div class='aspect-image' style='--aspect-ratio:#{width}/#{height};'/>")
           new_parent.first.add_child(img)
         end
-
-      elsif parent_class&.include?("instagram-images") && width > 0 && height > 0
+      elsif (parent_class&.include?("instagram-images") || parent_class&.include?("tweet-images")) && width > 0 && height > 0
         img.remove_attribute("width")
         img.remove_attribute("height")
         img.parent["class"] = "aspect-image-full-size"
diff --git a/lib/twitter_api.rb b/lib/twitter_api.rb
index da281fe05fe..d85df9b9a03 100644
--- a/lib/twitter_api.rb
+++ b/lib/twitter_api.rb
@@ -16,20 +16,17 @@ class TwitterApi
       result = Rinku.auto_link(text, :all, 'target="_blank"').to_s
 
       if tweet['extended_entities'] && media = tweet['extended_entities']['media']
-        result << "<div class='tweet-images'>"
         media.each do |m|
           if m['type'] == 'photo'
             if large = m['sizes']['large']
-              result << "<img class='tweet-image' src='#{m['media_url_https']}' width='#{large['w']}' height='#{large['h']}'>"
+              result << "<div class='tweet-images'><img class='tweet-image' src='#{m['media_url_https']}' width='#{large['w']}' height='#{large['h']}'></div>"
             end
           elsif m['type'] == 'video'
             if large = m['sizes']['large']
-              result << "<iframe class='tweet-video' src='https://twitter.com/i/videos/#{tweet['id_str']}' width='#{large['w']}' height='#{large['h']}' frameborder='0'></iframe>"
+              result << "<div class='tweet-images'><iframe class='tweet-video' src='https://twitter.com/i/videos/#{tweet['id_str']}' width='#{large['w']}' height='#{large['h']}' frameborder='0'></iframe></div>"
             end
           end
         end
-        result << "</div>"
-
       end
 
       result