Merge branch 'master' into data-visualization-sarah

1 files changed, 11 insertions, 2 deletions

diff --git a/src/client/views/ContextMenu.tsx b/src/client/views/ContextMenu.tsx
index e4c3e864b..d54d4dc7b 100644
--- a/src/client/views/ContextMenu.tsx
+++ b/src/client/views/ContextMenu.tsx
@@ -5,6 +5,8 @@ import { observer } from 'mobx-react';
 import './ContextMenu.scss';
 import { ContextMenuItem, ContextMenuProps, OriginalMenuProps } from './ContextMenuItem';
 import { Utils } from '../../Utils';
+import { StrCast } from '../../fields/Types';
+import { Doc } from '../../fields/Doc';
 
 @observer
 export class ContextMenu extends React.Component {
@@ -190,7 +192,11 @@ export class ContextMenu extends React.Component {
         }
         return this.filteredItems.map((value, index) =>
             Array.isArray(value) ? (
-                <div className="contextMenu-group">
+                <div className="contextMenu-group"
+                    style={{
+                        background: StrCast(Doc.UserDoc().userVariantColor)
+                    }}
+                >
                     <div className="contextMenu-description">{value.join(' -> ')}</div>
                 </div>
             ) : (
@@ -213,7 +219,10 @@ export class ContextMenu extends React.Component {
                         this._height = Number(getComputedStyle(r).height.replace('px', ''));
                     }
                 })}
-                style={{ left: this.pageX, ...(this._yRelativeToTop ? { top: this.pageY } : { bottom: this.pageY }) }}>
+                style={{ 
+                    left: this.pageX, ...(this._yRelativeToTop ? { top: this.pageY } : { bottom: this.pageY }),
+                    background: StrCast(Doc.UserDoc().userBackgroundColor)
+                }}>
                 {!this.itemsNeedSearch ? null : (
                     <span className={'search-icon'}>
                         <span className="icon-background">