aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/linking/LinkMenuItem.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/linking/LinkMenuItem.tsx')
-rw-r--r--src/client/views/linking/LinkMenuItem.tsx12
1 files changed, 8 insertions, 4 deletions
diff --git a/src/client/views/linking/LinkMenuItem.tsx b/src/client/views/linking/LinkMenuItem.tsx
index a81707ea4..9bc8f5e8b 100644
--- a/src/client/views/linking/LinkMenuItem.tsx
+++ b/src/client/views/linking/LinkMenuItem.tsx
@@ -130,7 +130,7 @@ export class LinkMenuItem extends React.Component<LinkMenuItemProps> {
};
deleteLink = (e: React.PointerEvent): void => setupMoveUpEvents(this, e, returnFalse, emptyFunction, undoBatch(action(() => LinkManager.Instance.deleteLink(this.props.linkDoc))));
-
+ @observable _hover = false;
render() {
const destinationIcon = Doc.toIcon(this.props.destinationDoc) as any as IconProp;
@@ -146,7 +146,11 @@ export class LinkMenuItem extends React.Component<LinkMenuItemProps> {
: undefined;
return (
- <div className="linkMenu-item" style={{ background: LinkManager.currentLink === this.props.linkDoc ? 'lightBlue' : undefined }}>
+ <div
+ className="linkMenu-item"
+ onPointerEnter={action(e => (this._hover = true))}
+ onPointerLeave={action(e => (this._hover = false))}
+ style={{ background: /*LinkManager.currentLink !== this.props.linkDoc*/ this._hover ? SettingsManager.userVariantColor : SettingsManager.userBackgroundColor }}>
<div className="linkMenu-item-content expand-two">
<div
ref={this._drag}
@@ -154,7 +158,7 @@ export class LinkMenuItem extends React.Component<LinkMenuItemProps> {
onPointerDown={this.onLinkButtonDown}>
<div className="linkMenu-item-buttons">
<Tooltip title={<div className="dash-tooltip">Edit Link</div>}>
- <div className="button" style={{ background: LinkManager.currentLink === this.props.linkDoc ? 'black' : 'gray' }} ref={this._editRef} onPointerDown={this.onEdit} onClick={e => e.stopPropagation()}>
+ <div className="button" ref={this._editRef} onPointerDown={this.onEdit} onClick={e => e.stopPropagation()}>
<FontAwesomeIcon className="fa-icon" icon="edit" size="sm" />
</div>
</Tooltip>
@@ -193,7 +197,7 @@ export class LinkMenuItem extends React.Component<LinkMenuItemProps> {
<div className="linkMenu-item-buttons">
<Tooltip title={<div className="dash-tooltip">Delete Link</div>}>
- <div className="button" style={{ background: 'red' }} onPointerDown={this.deleteLink} onClick={e => e.stopPropagation()}>
+ <div className="linkMenu-deleteButton" onPointerDown={this.deleteLink} onClick={e => e.stopPropagation()}>
<FontAwesomeIcon className="fa-icon" icon="trash" size="sm" />
</div>
</Tooltip>