From 9a76556beab9e45ae3bd4ce82617e9e0b1d7660c Mon Sep 17 00:00:00 2001
From: Christopher Chedeau <vjeuxx@gmail.com>
Date: Sat, 1 Feb 2020 05:54:33 +0000
Subject: [PATCH] Fixed wysiwyg carret disappearing on Chrome (#652)

There's a bug where the carret doesn't show up when the text is first focused on Chrome with the previous combination of CSS. I tweaked it and now it seems to work (don't ask me why!).

Unfortunately on Safari, ever since we moved to contentEditable on #274, the carret disappeared the first time. I unsuccessfully tried to repro in a smaller codebase ( https://jsfiddle.net/u2mjs90y/1/ ) but it does work in Safari...

I'm not exactly sure what's going on, there are bunch of issues opened against this bug when googling against all the browsers...
---
 src/element/textWysiwyg.tsx | 2 +-
 src/styles.scss             | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/element/textWysiwyg.tsx b/src/element/textWysiwyg.tsx
index d7056272..bbe405c4 100644
--- a/src/element/textWysiwyg.tsx
+++ b/src/element/textWysiwyg.tsx
@@ -39,7 +39,7 @@ export function textWysiwyg({
 
   Object.assign(editable.style, {
     color: strokeColor,
-    position: "fixed",
+    position: "absolute",
     opacity: opacity / 100,
     top: y + "px",
     left: x + "px",
diff --git a/src/styles.scss b/src/styles.scss
index c7f57ecc..6c097435 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -3,6 +3,10 @@
 body {
   margin: 0;
   font-family: Arial, Helvetica, sans-serif;
+  overflow: hidden;
+  position: fixed;
+  width: 100%;
+  height: 100%;
   color: var(--text-color-primary);
 }