From 63198c05b49ba2ef12f9edee924e07fb7af79d97 Mon Sep 17 00:00:00 2001
From: DD Liu <liudi08@gmail.com>
Date: Thu, 24 May 2018 14:16:00 -0400
Subject: [PATCH] Fix firefox wrap and opaque text selection (#474)

---
 src/components/paint-editor/paint-editor.css | 4 ++--
 src/helper/tools/text-tool.js                | 3 ++-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/paint-editor/paint-editor.css b/src/components/paint-editor/paint-editor.css
index bdb4646f..6f48b4b7 100644
--- a/src/components/paint-editor/paint-editor.css
+++ b/src/components/paint-editor/paint-editor.css
@@ -168,13 +168,13 @@ $border-radius: 0.25rem;
     background: transparent;
     border: none;
     display: none;
+    margin: 0px;
+    opacity: .8;
     outline: none;
     overflow: hidden;
     padding: 0px;
     position: absolute;
     resize: none;
-    white-space: nowrap;
-    margin: 0px;
     -webkit-text-fill-color: transparent;
     text-fill-color: transparent;
 }
diff --git a/src/helper/tools/text-tool.js b/src/helper/tools/text-tool.js
index 8e9e1f34..8e009b40 100644
--- a/src/helper/tools/text-tool.js
+++ b/src/helper/tools/text-tool.js
@@ -276,7 +276,8 @@ class TextTool extends paper.Tool {
         if (this.guide) this.guide.remove();
         this.guide = hoverBounds(this.textBox, TextTool.TEXT_PADDING);
         this.guide.dashArray = [4, 4];
-        this.element.style.width = `${this.textBox.internalBounds.width}px`;
+        // Prevent line from wrapping
+        this.element.style.width = `${this.textBox.internalBounds.width + 1}px`;
         this.element.style.height = `${this.textBox.internalBounds.height}px`;
     }
     /**