minor UI updates

1 files changed, 13 insertions, 14 deletions

diff --git a/src/client/views/nodes/button/FontIconBox.tsx b/src/client/views/nodes/button/FontIconBox.tsx
index b4b6ba76c..4f52e90b7 100644
--- a/src/client/views/nodes/button/FontIconBox.tsx
+++ b/src/client/views/nodes/button/FontIconBox.tsx
@@ -230,25 +230,27 @@ export class FontIconBox extends DocComponent<ButtonProps, FontIconDocument>(Fon
             const hex: string = value.hex;
             const s = ScriptField.MakeScript(script + '("' + hex + '")');
             if (s) {
-                // console.log(s.script);
                 s.script.run().result;
             }
-        }
+        };
         return (
             <div className={`menuButton ${this.type} ${active}`}
-                style={{ display: selectedDoc ? undefined : "none", color: color, backgroundColor: selectedDoc ? selectedDoc._backgroundColor : backgroundColor, borderBottomLeftRadius: this.dropdown ? 0 : undefined }}
+                style={{ display: selectedDoc ? undefined : "none", color: color, borderBottomLeftRadius: this.dropdown ? 0 : undefined }}
                 onClick={() => this.rootDoc.dropDownOpen = !this.rootDoc.dropDownOpen}
                 onPointerDown={e => e.stopPropagation()}>
                 <FontAwesomeIcon className={`fontIconBox-icon-${this.type}`} icon={this.icon} color={color} />
+                <div className="colorButton-color"
+                    style={{ backgroundColor: selectedDoc ? selectedDoc._backgroundColor : backgroundColor }}
+                ></div>
                 {label}
-                {dropdownCaret}
+                {/* {dropdownCaret} */}
                 {this.rootDoc.dropDownOpen ?
                     <div>
                         <div className="menuButton-dropdownBox"
                             onPointerDown={e => e.stopPropagation()}
                             onClick={e => e.stopPropagation()}
                             style={{ left: 0 }}>
-                            {colorBox((color) => click(color))}
+                            {colorBox(click)}
                         </div>
                         <div className="dropbox-background" onClick={(e) => { e.stopPropagation(); this.rootDoc.dropDownOpen = false; }} />
                     </div>
@@ -262,23 +264,20 @@ export class FontIconBox extends DocComponent<ButtonProps, FontIconDocument>(Fon
         const selectedDoc = numSelected > 0 ? SelectionManager.Views()[0].Document : undefined;
 
         const script: string = StrCast(this.rootDoc.script) + "(true)";
-        let toggleTrue: boolean | undefined = false;
-        if (script == 'toggleOverlay') {
-            toggleTrue = selectedDoc && BoolCast(selectedDoc.z);
-            console.log('toggleOverlay');
-        }
         const boolResult = ScriptField.MakeScript(script)?.script.run().result;
-        // console.log(this.rootDoc.title, script, boolResult);
+        if (script.includes("toggleOverlay")) {
+            console.log("boolResult: " + boolResult);
+        }
+
         const color = this.props.styleProvider?.(this.rootDoc, this.props, StyleProp.Color);
         const backgroundColor = this.props.styleProvider?.(this.rootDoc, this.props, StyleProp.BackgroundColor);
-        // const canClick: boolean = this.rootDoc.canClick ? eval(StrCast(this.rootDoc.canClick)) : false;
         const label = !this.label || !Doc.UserDoc()._showLabel ? (null) :
             <div className="fontIconBox-label" style={{ color: color, backgroundColor: backgroundColor, position: "absolute" }}>
                 {this.label}
             </div>;
         return (
-            <div className={`menuButton ${this.type}`} style={{ opacity: 1, backgroundColor: toggleTrue ? Colors.MEDIUM_BLUE : "transparent" }}>
-                <FontAwesomeIcon className={`fontIconBox-icon-${this.type}`} icon={this.icon} color={toggleTrue ? Colors.LIGHT_GRAY : Colors.LIGHT_GRAY} />
+            <div className={`menuButton ${this.type}`} style={{ opacity: 1, backgroundColor: boolResult ? Colors.MEDIUM_BLUE : "transparent" }}>
+                <FontAwesomeIcon className={`fontIconBox-icon-${this.type}`} icon={this.icon} color={boolResult ? Colors.LIGHT_GRAY : Colors.LIGHT_GRAY} />
                 {label}
             </div>
         )