fixed up dark schema a bit.

6 files changed, 17 insertions, 15 deletions

diff --git a/src/client/views/MainView.scss b/src/client/views/MainView.scss
index b608eceb1..d571a0428 100644
--- a/src/client/views/MainView.scss
+++ b/src/client/views/MainView.scss
@@ -334,7 +334,6 @@
     position: relative;
     z-index: 41; // lm_maximised has a z-index of 40 and this needs to be above that
     touch-action: none;
-    background-color: lightgrey;
     cursor: grab;
     display: flex;
     align-items: center;
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index 1730007a5..b3d198bd1 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -229,25 +229,28 @@ export class MainView extends React.Component {
     getContentsHeight = () => this._panelHeight - Number(SEARCH_PANEL_HEIGHT.replace("px", ""));
 
     defaultBackgroundColors = (doc: Opt<Doc>, renderDepth: number) => {
-        if (doc?.type === DocumentType.COL) {
-            return Doc.IsSystem(doc) ? "lightgrey" : StrCast(renderDepth > 0 ? Doc.UserDoc().activeCollectionNestedBackground : Doc.UserDoc().activeCollectionBackground);
-        }
         if (this.darkScheme) {
             switch (doc?.type) {
-                case DocumentType.FONTICON: return "white";
+                case DocumentType.PRESELEMENT: return "dimgrey";
+                case DocumentType.FONTICON: return "black";
                 case DocumentType.RTF || DocumentType.LABEL || DocumentType.BUTTON: return "#2d2d2d";
                 case DocumentType.LINK:
-                case DocumentType.COL: if (doc._viewType !== CollectionViewType.Freeform && doc._viewType !== CollectionViewType.Time) return "rgb(62,62,62)";
+                case DocumentType.COL:
+                    return Doc.IsSystem(doc) ? "rgb(62,62,62)" : StrCast(renderDepth > 0 ? Doc.UserDoc().activeCollectionNestedBackground : Doc.UserDoc().activeCollectionBackground);
+                //if (doc._viewType !== CollectionViewType.Freeform && doc._viewType !== CollectionViewType.Time) return "rgb(62,62,62)";
                 default: return "black";
             }
         } else {
             switch (doc?.type) {
+                case DocumentType.PRESELEMENT: return "";
                 case DocumentType.FONTICON: return "black";
                 case DocumentType.RTF: return "#f1efeb";
                 case DocumentType.BUTTON:
                 case DocumentType.LABEL: return "lightgray";
                 case DocumentType.LINK:
-                case DocumentType.COL: if (doc._viewType !== CollectionViewType.Freeform && doc._viewType !== CollectionViewType.Time) return "lightgray";
+                case DocumentType.COL:
+                    return Doc.IsSystem(doc) ? "lightgrey" : StrCast(renderDepth > 0 ? Doc.UserDoc().activeCollectionNestedBackground : Doc.UserDoc().activeCollectionBackground);
+                //if (doc._viewType !== CollectionViewType.Freeform && doc._viewType !== CollectionViewType.Time) return "lightgray";
                 default: return "white";
             }
         }
@@ -345,7 +348,7 @@ export class MainView extends React.Component {
                         ContainingCollectionView={undefined}
                         ContainingCollectionDoc={undefined}
                         relative={true}
-                        forcedBackgroundColor={() => "lightgrey"}
+                        forcedBackgroundColor={() => this.darkScheme ? "rgb(62,62,62)" : "lightgrey"}
                     />
                 </div>
                 {this.docButtons}
@@ -413,8 +416,8 @@ export class MainView extends React.Component {
             {this.menuPanel}
             <div className="mainView-innerContent" >
                 {this.flyout}
-                <div className="mainView-libraryHandle" style={{ display: !this._flyoutWidth ? "none" : undefined }} onPointerDown={this.onFlyoutPointerDown} >
-                    <FontAwesomeIcon icon="chevron-left" color="black" size="sm" />
+                <div className="mainView-libraryHandle" style={{ display: !this._flyoutWidth ? "none" : undefined, background: this.darkScheme ? "black" : "lightgrey" }} onPointerDown={this.onFlyoutPointerDown} >
+                    <FontAwesomeIcon icon="chevron-left" color={this.darkScheme ? "white" : "black"} size="sm" />
                 </div>
 
                 {this.dockingContent}
@@ -443,7 +446,7 @@ export class MainView extends React.Component {
     expandFlyout = action((button: Doc) => {
         this._flyoutWidth = (this._flyoutWidth || 250);
         this._sidebarContent.proto = button.target as any;
-        button._backgroundColor = "lightgrey";
+        button._backgroundColor = this.darkScheme ? "dimgrey" : "lightgrey";
         button.color = "black";
         this._lastButton = button;
     });
diff --git a/src/client/views/collections/CollectionDockingView.scss b/src/client/views/collections/CollectionDockingView.scss
index 8b1594b21..f4736eb29 100644
--- a/src/client/views/collections/CollectionDockingView.scss
+++ b/src/client/views/collections/CollectionDockingView.scss
@@ -4,7 +4,7 @@
 .lm_title {
     margin-top: 3px;
     border-radius: 5px;
-    border: solid 1px dimgray;
+    border: solid 0px dimgray;
     border-width: 2px 2px 0px;
     height: 20px;
     transform: translate(0px, -3px);
diff --git a/src/client/views/globalCssVariables.scss b/src/client/views/globalCssVariables.scss
index 1e0b023d7..b2ea87c06 100644
--- a/src/client/views/globalCssVariables.scss
+++ b/src/client/views/globalCssVariables.scss
@@ -33,7 +33,7 @@ $searchpanel-height: 32px;
 $mainTextInput-zindex: 999; // then text input overlay so that it's context menu will appear over decorations, etc
 $docDecorations-zindex: 998; // then doc decorations appear over everything else
 $remoteCursors-zindex: 997; // ... not sure what level the remote cursors should go -- is this right?
-$COLLECTION_BORDER_WIDTH: 1;
+$COLLECTION_BORDER_WIDTH: 0;
 $SCHEMA_DIVIDER_WIDTH: 4;
 $MINIMIZED_ICON_SIZE:25;
 $MAX_ROW_HEIGHT: 44px;
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.scss b/src/client/views/nodes/formattedText/FormattedTextBox.scss
index 9307f1649..b75cc230f 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.scss
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.scss
@@ -22,7 +22,7 @@
     border-style: solid;
     overflow-y: auto;
     overflow-x: hidden;
-    color: initial;
+    color: inherit;
     display: flex;
     flex-direction: row;
     transition: opacity 1s;
diff --git a/src/client/views/presentationview/PresElementBox.tsx b/src/client/views/presentationview/PresElementBox.tsx
index 8017468c3..7a28f8bff 100644
--- a/src/client/views/presentationview/PresElementBox.tsx
+++ b/src/client/views/presentationview/PresElementBox.tsx
@@ -311,7 +311,7 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps, PresDoc
                     <div className="presItem-number">
                         {`${this.indexInPres + 1}.`}
                     </div>}
-                {miniView ? (null) : <div ref={miniView ? null : this._dragRef} className={`presItem-slide ${isSelected ? "active" : ""}`}>
+                {miniView ? (null) : <div ref={miniView ? null : this._dragRef} className={`presItem-slide ${isSelected ? "active" : ""}`} style={{ backgroundColor: this.props.backgroundColor?.(this.layoutDoc, this.props.renderDepth) }}>
                     <div className="presItem-name" style={{ maxWidth: showMore ? (toolbarWidth - 175) : toolbarWidth - 85, cursor: isSelected ? 'text' : 'grab' }}>
                         <EditableView
                             ref={this._titleRef}