menu label changes

1 files changed, 11 insertions, 4 deletions

diff --git a/src/client/views/collections/collectionLinearView/CollectionLinearView.tsx b/src/client/views/collections/collectionLinearView/CollectionLinearView.tsx
index 5d89d82b4..3327bef36 100644
--- a/src/client/views/collections/collectionLinearView/CollectionLinearView.tsx
+++ b/src/client/views/collections/collectionLinearView/CollectionLinearView.tsx
@@ -17,6 +17,7 @@ import { StyleProp } from '../../StyleProvider';
 import "./CollectionLinearView.scss";
 import { CollectionSubView } from '.././CollectionSubView';
 import { CollectionViewType } from '.././CollectionView';
+import { Colors } from '../../global/globalEnums';
 
 
 type LinearDocument = makeInterface<[typeof documentSchema,]>;
@@ -114,14 +115,20 @@ export class CollectionLinearView extends CollectionSubView(LinearDocument) {
         const color = this.props.styleProvider?.(this.rootDoc, this.props, StyleProp.Color);
         const icon: string = StrCast(this.props.Document.icon);
 
-        const menuOpener = <label htmlFor={`${guid}`} style={{ pointerEvents: "all", cursor: "pointer", background: backgroundColor === color ? "black" : undefined, }}
+        const menuOpener = <label htmlFor={`${guid}`}
+            style={{
+                color: BoolCast(this.layoutDoc.linearViewIsExpanded) ? undefined : Colors.BLACK,
+                backgroundColor: backgroundColor === color ? "black" : BoolCast(this.layoutDoc.linearViewIsExpanded) ? undefined : Colors.LIGHT_GRAY
+            }}
             onPointerDown={e => e.stopPropagation()} >
-            <p>{BoolCast(this.layoutDoc.linearViewIsExpanded) ? icon ? icon : "–" : icon ? icon : "+"}</p>
+            <div className="collectionLinearView-menuOpener">
+                {BoolCast(this.layoutDoc.linearViewIsExpanded) ? icon ? icon : "–" : icon ? icon : "+"}
+            </div>
         </label>;
 
-        return <div className={`collectionLinearView-outer ${this.layoutDoc.linearViewSubMenu}`} style={{backgroundColor: BoolCast(this.layoutDoc.linearViewIsExpanded) ? undefined : "transparent"}}>
+        return <div className={`collectionLinearView-outer ${this.layoutDoc.linearViewSubMenu}`} style={{ backgroundColor: BoolCast(this.layoutDoc.linearViewIsExpanded) ? undefined : "transparent" }}>
             <div className="collectionLinearView" ref={this.createDashEventsTarget} >
-                {!expandable ? (null) : <Tooltip title={<><div className="dash-tooltip">{BoolCast(this.props.Document.linearViewIsExpanded) ? "Close menu" : "Open menu"}</div></>} placement="top">
+                {!expandable ? (null) : <Tooltip title={<><div className="dash-tooltip">{BoolCast(this.props.Document.linearViewIsExpanded) ? "Close" : "Open"}</div></>} placement="top">
                     {menuOpener}
                 </Tooltip>}
                 <input id={`${guid}`} type="checkbox" checked={BoolCast(this.props.Document.linearViewIsExpanded)} ref={this.addMenuToggle}