2 files changed, 9 insertions, 10 deletions
diff --git a/ext/bg/css/popup-preview.css b/ext/bg/css/popup-preview.css
index fd8df47a..3828d236 100644
--- a/ext/bg/css/popup-preview.css
+++ b/ext/bg/css/popup-preview.css
@@ -16,16 +16,13 @@
  */
 
 html {
-    --text-color: #333333;
-    --background-color: #ffffff;
-    --theme-transition: background-color 0.25s linear 0s, color 0.25s linear 0s;
-    transition: var(--theme-transition);
-    background-color: var(--background-color);
-    color: var(--text-color);
+    transition: background-color 0.25s linear 0s, color 0.25s linear 0s;
+    background-color: rgba(255, 255, 255, 0);
+    color: #333333;
 }
 html.dark {
-    --text-color: #d4d4d4;
-    --background-color: #1e1e1e;
+    color: #d4d4d4;
+    background-color: #1e1e1e;
 }
 html,
 body {
@@ -99,7 +96,9 @@ body {
     top: 0;
     right: 0;
     bottom: 0;
-    background-color: var(--background-color);
+}
+.example-text-input:not([hidden])+.example-text {
+    visibility: hidden;
 }
 
 .popup-placeholder {
diff --git a/ext/bg/js/settings/popup-preview-frame.js b/ext/bg/js/settings/popup-preview-frame.js
index 7e177453..1a05a48d 100644
--- a/ext/bg/js/settings/popup-preview-frame.js
+++ b/ext/bg/js/settings/popup-preview-frame.js
@@ -224,7 +224,7 @@ class PopupPreviewFrame {
         if (textNode === null) { return; }
 
         const range = document.createRange();
-        range.selectNode(textNode);
+        range.selectNodeContents(textNode);
         const source = new TextSourceRange(range, range.toString(), null, null);
 
         try {