diff options
author | bobzel <zzzman@gmail.com> | 2021-10-07 09:43:19 -0400 |
---|---|---|
committer | bobzel <zzzman@gmail.com> | 2021-10-07 09:43:19 -0400 |
commit | 8f1a6266cf0a728ab2b7df11d45a023de266fae4 (patch) | |
tree | a2f9722abc1132a7af8428c8a7992794c9417719 /src/client/views/linking/LinkMenuItem.tsx | |
parent | 43496b4cd19a06d2682f2416a4273e25cdcb55a0 (diff) |
link menu ui tweaking. edge case checks for linkrelationship stuff. default links to have linkAutoMove
Diffstat (limited to 'src/client/views/linking/LinkMenuItem.tsx')
-rw-r--r-- | src/client/views/linking/LinkMenuItem.tsx | 18 |
1 files changed, 9 insertions, 9 deletions
diff --git a/src/client/views/linking/LinkMenuItem.tsx b/src/client/views/linking/LinkMenuItem.tsx index e0b20ef6f..f19064e49 100644 --- a/src/client/views/linking/LinkMenuItem.tsx +++ b/src/client/views/linking/LinkMenuItem.tsx @@ -165,19 +165,19 @@ export class LinkMenuItem extends React.Component<LinkMenuItemProps> { <div className="linkMenu-item-buttons" ref={this._buttonRef} > - <Tooltip title={<><div className="dash-tooltip">{this.props.linkDoc.hidden ? "Show Anchor" : "Hide Anchor"}</div></>}> - <div className="button" ref={this._editRef} onPointerDown={this.showAnchor} onClick={e => e.stopPropagation()}> - <FontAwesomeIcon className="fa-icon" icon={this.props.linkDoc.hidden ? "eye" : "eye-slash"} size="sm" /></div> + <Tooltip title={<><div className="dash-tooltip">{this.props.linkDoc.hidden ? "Show Link Anchor" : "Hide Link Anchor"}</div></>}> + <div className="button" ref={this._editRef} style={{ background: this.props.linkDoc.hidden ? "" : "#4476f7" /* $medium-blue */ }} onPointerDown={this.showAnchor} onClick={e => e.stopPropagation()}> + <FontAwesomeIcon className="fa-icon" icon={"eye"} size="sm" /></div> </Tooltip> - <Tooltip title={<><div className="dash-tooltip">{!this.props.linkDoc.linkDisplay ? "Show link" : "Hide link"}</div></>}> - <div className="button" ref={this._editRef} onPointerDown={this.showLink} onClick={e => e.stopPropagation()}> - <FontAwesomeIcon className="fa-icon" icon={!this.props.linkDoc.linkDisplay ? "project-diagram" : "unlink"} size="sm" /></div> + <Tooltip title={<><div className="dash-tooltip">{this.props.linkDoc.linkDisplay ? "Hide Link Line" : "Show Link Line"}</div></>}> + <div className="button" ref={this._editRef} style={{ background: this.props.linkDoc.hidden ? "gray" : this.props.linkDoc.linkDisplay ? "#4476f7"/* $medium-blue */ : "" }} onPointerDown={this.showLink} onClick={e => e.stopPropagation()}> + <FontAwesomeIcon className="fa-icon" icon={"project-diagram"} size="sm" /></div> </Tooltip> - <Tooltip title={<><div className="dash-tooltip">{!this.props.linkDoc.linkAutoMove ? "Auto move dot" : "Freeze dot position"}</div></>}> - <div className="button" ref={this._editRef} onPointerDown={this.autoMove} onClick={e => e.stopPropagation()}> - <FontAwesomeIcon className="fa-icon" icon={this.props.linkDoc.linkAutoMove ? "play" : "pause"} size="sm" /></div> + <Tooltip title={<><div className="dash-tooltip">{this.props.linkDoc.linkAutoMove ? "Click to freeze link anchor position" : "Click to auto move link anchor"}</div></>}> + <div className="button" ref={this._editRef} style={{ background: !this.props.linkDoc.linkAutoMove ? "" : "#4476f7" /* $medium-blue */ }} onPointerDown={this.autoMove} onClick={e => e.stopPropagation()}> + <FontAwesomeIcon className="fa-icon" icon={"play"} size="sm" /></div> </Tooltip> <Tooltip title={<><div className="dash-tooltip">Edit Link</div></>}> |