changes

content/root.css

@@ -137,7 +137,7 @@ body {
 }
 
 .delete-button:hover {
-	background: var(--pum-button-inactive-fg);
+	background: var(--timestamp-color);
 }
 
 .settings-icon, .users-icon, .theme-icon{
@@ -256,7 +256,7 @@ body {
 }
 
 .youtube-embed {
-	position: relative;
+	position: inline;
 	padding-top: 10px;
 	width: 100%;
 	max-width: 560px;  /* Standard YouTube width */

content/root.js

@@ -184,29 +184,25 @@ async function loadMessages() {
 							url,
 						);
 						if (videoId) {
-							return `<div class="youtube-embed">
+							return `<div class="youtube-embed"><iframe 
-									<iframe 
 									    width="100%" 
 									    height="315" 
 									    src="https://www.youtube.com/embed/${videoId}" 
 									    frameborder="0" 
 									    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" 
 									    allowfullscreen>
-									</iframe>
+									</iframe></div>`;
-								</div>`;
 						} else if (isImageUrl(url)) {
 							console.log(
 								"Attempting to embed image:",
 								url,
 							);
-							return `<div class="image-embed">
+							return `<div class="image-embed"><img 
-									<img 
 									    src="${url}" 
 									    alt="Embedded image" 
 									    loading="lazy" 
 									    onerror="console.log('Image failed to load:', this.src); this.style.display='none'"
-									    onload="console.log('Image loaded successfully:', this.src)">
+									    onload="console.log('Image loaded successfully:', this.src)"></div>`;
-								</div>`;
 						}
 						return `<a href="${url}" target="_blank" rel="noopener noreferrer">${url}</a>`;
 					},

readme.md

@@ -3,7 +3,7 @@
 ### High Priority
 - Nothing yet 
 ### Mid Priority
-- Nothing yet 
+- Other embeds (Twitter posts, spotify tracks, soundcloud, github repos, instagram posts, other video platforms)
 ### Low Priority
 - Mobile formatting @media
 ## Backend