From ee06e72dab596ead6903c3ab3432ecab458613cb Mon Sep 17 00:00:00 2001
From: dinhanhtruong <70963346+dinhanhtruong@users.noreply.github.com>
Date: Mon, 26 Jul 2021 18:45:28 -0400
Subject: Link editor menu UI cleanup + color changes + temp removal of
 linkpopup for PR

---
 src/client/views/collections/CollectionLinearView.scss |  4 ++--
 src/client/views/linking/LinkEditor.scss               |  8 ++++----
 src/client/views/linking/LinkMenu.scss                 |  9 ++++-----
 src/client/views/linking/LinkMenuItem.scss             |  6 +++---
 src/client/views/linking/LinkPopup.tsx                 |  3 +--
 src/client/views/nodes/DocumentLinksButton.scss        |  1 +
 src/client/views/nodes/DocumentLinksButton.tsx         |  4 ++--
 src/client/views/pdf/AnchorMenu.tsx                    | 13 +++++++------
 8 files changed, 24 insertions(+), 24 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionLinearView.scss b/src/client/views/collections/CollectionLinearView.scss
index 632f8dbab..dd1e1fbe8 100644
--- a/src/client/views/collections/CollectionLinearView.scss
+++ b/src/client/views/collections/CollectionLinearView.scss
@@ -20,10 +20,10 @@
         }
 
         .bottomPopup-background {
-            background: rgb(173, 216, 230);
+            background: $light-blue;
             padding-right: 14px;
             height: 35;
-            transform: translate3d(6px, 5px, 0px);
+            transform: translate3d(6px, 0px, 0px);
             padding-top: 6.5px;
             padding-bottom: 7px;
             padding-left: 5px;
diff --git a/src/client/views/linking/LinkEditor.scss b/src/client/views/linking/LinkEditor.scss
index 839ebf894..9fddede65 100644
--- a/src/client/views/linking/LinkEditor.scss
+++ b/src/client/views/linking/LinkEditor.scss
@@ -22,7 +22,7 @@
 .linkEditor-info {
     //border-bottom: 0.5px solid $light-gray;
     //padding-bottom: 1px;
-    padding-top: 5px;
+    padding: 12px;
     padding-left: 5px;
     //margin-bottom: 6px;
     display: flex;
@@ -61,7 +61,7 @@
 }
 
 .linkEditor-description {
-    padding-left: 6.5px;
+    padding-left: 26px;
     padding-right: 6.5px;
     padding-bottom: 3.5px;
 
@@ -107,9 +107,9 @@
 }
 
 .linkEditor-followingDropdown {
-    padding-left: 6.5px;
+    padding-left: 26px;
     padding-right: 6.5px;
-    padding-bottom: 6px;
+    padding-bottom: 15cpx;
 
     &:hover {
         cursor: pointer;
diff --git a/src/client/views/linking/LinkMenu.scss b/src/client/views/linking/LinkMenu.scss
index bcd93aed1..19c6463d3 100644
--- a/src/client/views/linking/LinkMenu.scss
+++ b/src/client/views/linking/LinkMenu.scss
@@ -13,9 +13,8 @@
         border: 1px solid #e4e4e4;
         box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
         background: white;
-
         min-width: 170px;
-        max-height: 170px;
+        max-height: 230px;
         overflow-y: scroll;
         z-index: 10;
     }
@@ -50,9 +49,9 @@
 
 
         &:hover {
-            p {
-                background-color: lightgray;
-            }
+            // p {
+            //     background-color: lightgray;
+            // }
 
             p.expand-one {
                 width: calc(100% + 20px);
diff --git a/src/client/views/linking/LinkMenuItem.scss b/src/client/views/linking/LinkMenuItem.scss
index 38363c2c4..90722daf9 100644
--- a/src/client/views/linking/LinkMenuItem.scss
+++ b/src/client/views/linking/LinkMenuItem.scss
@@ -55,8 +55,8 @@
 
                 .linkMenu-destination-title {
                     text-decoration: none;
-                    color: rgb(85, 120, 196);
-                    font-size: 14px;
+                    color: #4476F7;
+                    font-size: 16px;
                     padding-bottom: 2px;
                     padding-right: 4px;
                     margin-right: 4px;
@@ -76,7 +76,7 @@
                 text-decoration: none;
                 font-style: italic;
                 color: rgb(95, 97, 102);
-                font-size: 10px;
+                font-size: 9px;
                 margin-left: 20px;
                 max-width: 125px;
                 height: auto;
diff --git a/src/client/views/linking/LinkPopup.tsx b/src/client/views/linking/LinkPopup.tsx
index 89d5b7272..2c4b718f4 100644
--- a/src/client/views/linking/LinkPopup.tsx
+++ b/src/client/views/linking/LinkPopup.tsx
@@ -42,14 +42,13 @@ interface LinkPopupProps {
 export class LinkPopup extends React.Component<LinkPopupProps> {
     @observable private linkURL: string = "";
     @observable public view?: EditorView;
-    private Instance: LinkPopup = this;
 
 
 
     // TODO: should check for valid URL
     @undoBatch
     makeLinkToURL = (target: string, lcoation: string) => {
-        ((this as any)?.TextView as FormattedTextBox).makeLinkAnchor(undefined, "onRadd:rightight", target, target);
+        ((this.view as any)?.TextView as FormattedTextBox).makeLinkAnchor(undefined, "onRadd:rightight", target, target);
     }
 
     @action
diff --git a/src/client/views/nodes/DocumentLinksButton.scss b/src/client/views/nodes/DocumentLinksButton.scss
index daffaf9e7..93e1737fe 100644
--- a/src/client/views/nodes/DocumentLinksButton.scss
+++ b/src/client/views/nodes/DocumentLinksButton.scss
@@ -6,6 +6,7 @@
     min-height: 20;
     position: absolute;
 }
+
 .documentLinksButton,
 .documentLinksButton-endLink,
 .documentLinksButton-startLink {
diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx
index 4b4079670..ddc36daa1 100644
--- a/src/client/views/nodes/DocumentLinksButton.tsx
+++ b/src/client/views/nodes/DocumentLinksButton.tsx
@@ -143,7 +143,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
                 } else if (DocumentLinksButton.StartLink && DocumentLinksButton.StartLink !== this.props.View.props.Document) {
                     const sourceDoc = DocumentLinksButton.StartLink;
                     const targetDoc = this.props.View.ComponentView?.getAnchor?.() || this.props.View.Document;
-                    const linkDoc = DocUtils.MakeLink({ doc: sourceDoc }, { doc: targetDoc }, "link"); //why is long drag here when this is used for completing links by clicking?
+                    const linkDoc = DocUtils.MakeLink({ doc: sourceDoc }, { doc: targetDoc }, "links"); //why is long drag here when this is used for completing links by clicking?
 
                     LinkManager.currentLink = linkDoc;
 
@@ -257,7 +257,7 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
             <div className={"documentLinksButton"}
                 onPointerDown={this.onLinkButtonDown} onClick={this.onLinkClick}
                 style={{
-                    backgroundColor: this.props.InMenu ? "" : "#add8e6",
+                    backgroundColor: this.props.InMenu ? "" : '#BDDDF5',
                     color: this.props.InMenu ? "white" : "black",
                     width: btnDim,
                     height: btnDim,
diff --git a/src/client/views/pdf/AnchorMenu.tsx b/src/client/views/pdf/AnchorMenu.tsx
index f9e12f462..70ca19842 100644
--- a/src/client/views/pdf/AnchorMenu.tsx
+++ b/src/client/views/pdf/AnchorMenu.tsx
@@ -147,12 +147,13 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
                     </button>
                 </Tooltip>,
 
-                <Tooltip key="link" title={<div className="dash-tooltip">{"Link selected text to document or URL"}</div>}>
-                    <button className="antimodeMenu-button link" onPointerDown={this.toggleLinkPopup} style={{}}>
-                        <FontAwesomeIcon icon="link" size="lg" />
-                    </button>
-                </Tooltip>,
-                <LinkPopup showPopup={this._showLinkPopup} />
+                //NOTE: link popup is currently incomplete
+                // <Tooltip key="link" title={<div className="dash-tooltip">{"Link selected text to document or URL"}</div>}>
+                //     <button className="antimodeMenu-button link" onPointerDown={this.toggleLinkPopup} style={{}}>
+                //         <FontAwesomeIcon icon="link" size="lg" />
+                //     </button>
+                // </Tooltip>,
+                // <LinkPopup showPopup={this._showLinkPopup} />
             ] : [
                 <Tooltip key="trash" title={<div className="dash-tooltip">{"Remove Link Anchor"}</div>}>
                     <button className="antimodeMenu-button" onPointerDown={this.Delete}>
-- 
cgit v1.2.3-70-g09d2