From 70e4b27c0332a37036ffdddcd99f0f7fb4ba716c Mon Sep 17 00:00:00 2001
From: keyan <keyan.kousha+huumn@gmail.com>
Date: Tue, 21 Nov 2023 16:20:54 -0600
Subject: [PATCH] fix youtube/twitter embed styling when there's text

---
 components/item-full.js |  2 +-
 styles/item.module.css  | 13 +++++++++++++
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/components/item-full.js b/components/item-full.js
index 92aef1f0..3ebcce0f 100644
--- a/components/item-full.js
+++ b/components/item-full.js
@@ -86,7 +86,7 @@ function ItemEmbed ({ item }) {
   const youtube = item.url?.match(/(https?:\/\/)?((www\.)?(youtube(-nocookie)?|youtube.googleapis)\.com.*(v\/|v=|vi=|vi\/|e\/|embed\/|user\/.*\/u\/\d+\/)|youtu\.be\/)(?<id>[_0-9a-z-]+)((?:\?|&)(?:t|start)=(?<start>\d+))?/i)
   if (youtube?.groups?.id) {
     return (
-      <div style={{ maxWidth: '640px', paddingRight: '15px' }}>
+      <div className={styles.youtubeContainerContainer}>
         <YouTube
           videoId={youtube.groups.id} className={styles.youtubeContainer} opts={{
             playerVars: {
diff --git a/styles/item.module.css b/styles/item.module.css
index baa89048..1dc835df 100644
--- a/styles/item.module.css
+++ b/styles/item.module.css
@@ -36,6 +36,19 @@
     position: relative;
 }
 
+.youtubeContainerContainer {
+    max-width: 640px;
+    padding-right: 15px;
+}
+
+.twitterContainer:not(:first-child) {
+    margin-top: .75rem;
+}
+
+.youtubeContainerContainer:not(:first-child) {
+    margin-top: .75rem;
+}
+
 .twitterContainer iframe {
     border-radius: 12px;
 }