From e26d62f78d0b60642b234c86160751ebb4546519 Mon Sep 17 00:00:00 2001
From: cudr <codefaster@yandex.ru>
Date: Sun, 17 May 2020 15:43:56 +0300
Subject: [PATCH] fix: caret styles

---
 packages/example/src/Caret.tsx | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/packages/example/src/Caret.tsx b/packages/example/src/Caret.tsx
index a70bd9a..8e0e59c 100644
--- a/packages/example/src/Caret.tsx
+++ b/packages/example/src/Caret.tsx
@@ -18,12 +18,17 @@ const Caret: React.FC<Caret> = ({ color, isForward, name }) => {
     left: isForward ? '100%' : '0%'
   }
 
+  caretStyles[isForward ? 'bottom' : 'top'] = 0
+
   return (
     <>
-      <span contentEditable={false} style={cursorStyles}>
-        {name}
+      <span contentEditable={false} style={caretStyles}>
+        <span style={{ position: 'relative' }}>
+          <span contentEditable={false} style={cursorStyles}>
+            {name}
+          </span>
+        </span>
       </span>
-      <span contentEditable={false} style={caretStyles} />
     </>
   )
 }
@@ -44,7 +49,6 @@ const cursorStyleBase = {
 
 const caretStyleBase = {
   position: 'absolute',
-  top: 0,
   pointerEvents: 'none',
   userSelect: 'none',
   height: '1.2em',