Popup preview fixes (#948)

* Select just the text node and not its container * Make background color transparent by default
FooSoft · Oct 21, 2020 · 9bda0a9 · 9bda0a9
1 parent ecbac2c
commit 9bda0a9
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 10 deletions.
diff --git 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
@@ -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 {