fixes for marquee/insert cursor color on dark backgrounds and drag label

1 files changed, 9 insertions, 3 deletions

diff --git a/src/client/views/PreviewCursor.tsx b/src/client/views/PreviewCursor.tsx
index 82d2bff56..1d88e9ad6 100644
--- a/src/client/views/PreviewCursor.tsx
+++ b/src/client/views/PreviewCursor.tsx
@@ -1,9 +1,9 @@
 import { action, observable, runInAction } from 'mobx';
 import { observer } from 'mobx-react';
 import * as React from 'react';
-import { Doc } from '../../fields/Doc';
+import { Doc, Opt } from '../../fields/Doc';
 import { StrCast } from '../../fields/Types';
-import { returnFalse } from '../../Utils';
+import { lightOrDark, returnFalse } from '../../Utils';
 import { Docs, DocumentOptions, DocUtils } from '../documents/Documents';
 import { ImageUtils } from '../util/Import & Export/ImageUtils';
 import { Transform } from '../util/Transform';
@@ -21,6 +21,7 @@ export class PreviewCursor extends React.Component<{}> {
     static _slowLoadDocuments?: (files: File[] | string, options: DocumentOptions, generatedDocuments: Doc[], text: string, completed: ((doc: Doc[]) => void) | undefined, addDocument: (doc: Doc | Doc[]) => boolean) => Promise<void>;
     @observable static _clickPoint = [0, 0];
     @observable public static Visible = false;
+    public static Doc: Opt<Doc>;
     constructor(props: any) {
         super(props);
         document.addEventListener('keydown', this.onKeyPress);
@@ -178,7 +179,12 @@ export class PreviewCursor extends React.Component<{}> {
     }
     render() {
         return !PreviewCursor._clickPoint || !PreviewCursor.Visible ? null : (
-            <div className={`previewCursor${StrCast(Doc.ActiveDashboard?.colorScheme)}`} onBlur={this.onBlur} tabIndex={0} ref={e => e?.focus()} style={{ transform: `translate(${PreviewCursor._clickPoint[0]}px, ${PreviewCursor._clickPoint[1]}px)` }}>
+            <div
+                className="previewCursor"
+                onBlur={this.onBlur}
+                tabIndex={0}
+                ref={e => e?.focus()}
+                style={{ color: lightOrDark(PreviewCursor.Doc?.backgroundColor ?? 'white'), transform: `translate(${PreviewCursor._clickPoint[0]}px, ${PreviewCursor._clickPoint[1]}px)` }}>
                 I
             </div>
         );