From a11cbed94999a437d3b51dbf8632441acdb8b5be Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 8 Sep 2021 09:33:16 -0400
Subject: tried adjusting text annotation button so text would be more readable
 in corner.

---
 .../views/nodes/formattedText/FormattedTextBox.scss     | 17 +++++++----------
 .../views/nodes/formattedText/FormattedTextBox.tsx      |  6 ++++--
 2 files changed, 11 insertions(+), 12 deletions(-)

(limited to 'src')

diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.scss b/src/client/views/nodes/formattedText/FormattedTextBox.scss
index 56f5c5631..4134e3c67 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.scss
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.scss
@@ -66,11 +66,12 @@ audiotag:hover {
     
 .formattedTextBox-sidebar-handle {
     position: absolute;
-    top: 5px;
+    top: 0;
+    left: 17px;
     //top: calc(50% - 17.5px);  // use this to center vertically -- make sure it looks okay for slide views
-    width: 25px;
-    height: 100%;
-    max-height: 25px;
+    width: 17px;
+    height: 17px;
+    border-radius: 3px;
     color: white;
     background: $medium-gray;
     border-radius: 5px;
@@ -80,8 +81,9 @@ audiotag:hover {
     cursor:grabbing;
     box-shadow: $standard-box-shadow;
     // transition: 0.2s;
-
+    opacity: 0.3;
     &:hover{
+        opacity: 1 !important;
         filter: brightness(0.85);
     }
 
@@ -425,12 +427,7 @@ footnote::after {
     
     .formattedTextBox-sidebar-handle {
         position: absolute;
-        top: 0;
-        //top: calc(50% - 17.5px);  // use this to center vertically -- make sure it looks okay for slide views
-        width: 10px;
-        height: 35px;
         background: lightgray;
-        border-radius: 20px;
         cursor: grabbing;
     }
 
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index cad9af2b0..bc19320e9 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -1360,6 +1360,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
         this._undoTyping = undefined;
         return wasUndoing;
     }
+
     @action
     onBlur = (e: any) => {
         FormattedTextBox.Focused === this && (FormattedTextBox.Focused = undefined);
@@ -1485,9 +1486,10 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
         const backgroundColor = !annotated ? this.sidebarWidth() ? Colors.MEDIUM_BLUE : Colors.BLACK : this.props.styleProvider?.(this.rootDoc, this.props, StyleProp.WidgetColor + (annotated ? ":annotated" : ""));
         return (!annotated && !this.props.isContentActive()) ? (null) : <div className="formattedTextBox-sidebar-handle" onPointerDown={this.sidebarDown}
             style={{
-                left: `max(0px, calc(100% - ${this.sidebarWidthPercent} ${"- 30px"}))`,
+                left: `max(0px, calc(100% - ${this.sidebarWidthPercent} ${"- 17px"}))`,
                 backgroundColor: backgroundColor,
-                color: color
+                color: color,
+                opacity: annotated ? 1 : undefined
             }} >
             <FontAwesomeIcon icon={"comment-alt"} />
         </div>;
-- 
cgit v1.2.3-70-g09d2