From a33e46f958ec07a0bf9da11421ae01e106bca421 Mon Sep 17 00:00:00 2001
From: Daniele Tonon <tonon@vitamino.it>
Date: Tue, 28 Nov 2023 21:37:25 +0100
Subject: [PATCH] Improve dark mode for web widgets

---
 templates/embed.js | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/templates/embed.js b/templates/embed.js
index 4e488a4..5862e1f 100644
--- a/templates/embed.js
+++ b/templates/embed.js
@@ -16,12 +16,27 @@
     // Basic styles
     iframe.style.width = width;
     iframe.style.height = height;
-    iframe.style.border = '2px solid #807a7a';
-    iframe.style.borderRadius = '10px';
+    // iframe.style.border = '2px solid #b6b6b6';
+    // iframe.style.borderRadius = '10px';
 
     // Add a class to easily permit overwriting the styles
     iframe.classList.add("nostr-embedded")
+    
+    const myCSSClass = `
+    .nostr-embedded {
+        border: 2px solid #C9C9C9;
+        border-radius: 10px;
+    }
+    @media (prefers-color-scheme: dark) {
+        .nostr-embedded {
+            border-color: #393939; /* Adjust the color for dark mode */
+        }
+    }
+    `;
 
+    const styleElement = document.createElement('style');
+    styleElement.textContent = myCSSClass;
+    scriptElement.parentNode.insertBefore(styleElement, scriptElement.nextSibling);
     scriptElement.parentNode.insertBefore(iframe, scriptElement.nextSibling);
 
     // Listen for messages from the iframe