caret display when blur

dist/assets/a-doc-editor.css

@@ -6,6 +6,7 @@
 
 .a-doc-editor canvas:focus-visible {
     /* outline: auto rgb(0, 68, 255, 50%); */
+    outline: none;
     background: #fff;
 }
 
@@ -52,6 +53,7 @@
 
 .a-doc-editor .body .right-sidebar {
     position: absolute;
+    padding: 8px;
     height: 100%;
     right: 0;
     width: 17%;
@@ -61,7 +63,7 @@
 }
 
 .a-doc-editor .body .right-sidebar.hide {
-    right: -14%;
+    right: -16%;
     transition: 300ms;
 }
 

dist/assets/a-doc-editor.js

@@ -86,14 +86,16 @@ var ADocEditor = function (customConfig) {
         <div class="scrolling-area" id="${scrollingAreaId}"></div>
         <div class="left-sidebar hide" id="${leftSidebarId}">
             <div class="toggle-sidebar">
+                <span></span>
                 <span>Summary</span>
-                <span>X</span>
+                <span>&lrarr;</span>
             </div>
         </div>
         <div class="right-sidebar hide" id="${rightSidebarId}">
             <div class="toggle-sidebar">
-                <span>X</span>
+                <span>&lrarr;</span>
                 <span>Comments</span>
+                <span></span>
             </div>
         </div>
     </div>
@@ -223,7 +225,7 @@ var ADocEditor = function (customConfig) {
             return true
         }
 
-        if (!caretData.blink && focusedCanvas && caretData.activeData) renderCaret()
+        if (!caretData.blink && caretData.activeData) renderCaret()
         // to render caret
         function renderCaret() {
             let ctx = canvasList[caretData.canvasIndex].getContext('2d', { willReadFrequently: true })
@@ -273,7 +275,7 @@ var ADocEditor = function (customConfig) {
         }
         function onBlurHandler(e) {
             focusedCanvas = null
-            caretData.blink = true
+            caretData.blink = false
             reRenderPages(dataSet)
             clearInterval(caretData.interval)
         }