From f82baffbe4269deb257604a8203e10d727ff0a1b Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Mon, 28 Aug 2023 02:55:30 -0400
Subject: trying to fix more colors

---
 src/client/views/nodes/FontIconBox/FontIconBox.tsx | 54 ++++++++++++++--------
 1 file changed, 35 insertions(+), 19 deletions(-)

(limited to 'src/client/views/nodes/FontIconBox')

diff --git a/src/client/views/nodes/FontIconBox/FontIconBox.tsx b/src/client/views/nodes/FontIconBox/FontIconBox.tsx
index fc66d40db..64f289cf7 100644
--- a/src/client/views/nodes/FontIconBox/FontIconBox.tsx
+++ b/src/client/views/nodes/FontIconBox/FontIconBox.tsx
@@ -10,6 +10,7 @@ import { BoolCast, Cast, NumCast, ScriptCast, StrCast } from '../../../../fields
 import { Utils } from '../../../../Utils';
 import { CollectionViewType, DocumentType } from '../../../documents/DocumentTypes';
 import { SelectionManager } from '../../../util/SelectionManager';
+import { SettingsManager } from '../../../util/SettingsManager';
 import { undoable, UndoManager } from '../../../util/UndoManager';
 import { ContextMenu } from '../../ContextMenu';
 import { DocComponent } from '../../DocComponent';
@@ -126,11 +127,11 @@ export class FontIconBox extends DocComponent<ButtonProps>() {
         const color = this.props.styleProvider?.(this.rootDoc, this.props, StyleProp.Color);
         // Script for checking the outcome of the toggle
         const checkResult = Number(Number(numScript().result ?? 0).toPrecision(NumCast(this.dataDoc.numPrecision, 3)));
-        const label = !Doc.GetShowIconLabels() ? null : <div className="fontIconBox-label">{this.label}</div>;
 
         return (
             <NumberDropdown
                 color={color}
+                background={SettingsManager.userBackgroundColor}
                 numberDropdownType={type}
                 showPlusMinus={false}
                 tooltip={this.label}
@@ -154,7 +155,7 @@ export class FontIconBox extends DocComponent<ButtonProps>() {
         return (
             <div
                 className={`menuButton ${this.type} ${active}`}
-                style={{ color: color, backgroundColor: backgroundColor, borderBottomLeftRadius: this.dropdown ? 0 : undefined }}
+                style={{ color, backgroundColor, borderBottomLeftRadius: this.dropdown ? 0 : undefined }}
                 onClick={action(() => {
                     this.rootDoc.dropDownOpen = !this.rootDoc.dropDownOpen;
                     this.noTooltip = this.rootDoc.dropDownOpen;
@@ -179,10 +180,7 @@ export class FontIconBox extends DocComponent<ButtonProps>() {
      * Dropdown list
      */
     @computed get dropdownListButton() {
-        const active: string = StrCast(this.rootDoc.dropDownOpen);
         const color = this.props.styleProvider?.(this.rootDoc, this.props, StyleProp.Color);
-        const backgroundColor = this.props.styleProvider?.(this.rootDoc, this.props, StyleProp.BackgroundColor);
-
         const script = ScriptCast(this.rootDoc.script);
 
         let noviceList: string[] = [];
@@ -206,11 +204,21 @@ export class FontIconBox extends DocComponent<ButtonProps>() {
                             text = Utils.cleanDocumentType(StrCast(selected.type) as DocumentType);
                             icon = Doc.toIcon(selected);
                         }
-                        return <Popup icon={<FontAwesomeIcon size={'1x'} icon={icon} />} text={text} type={Type.TERT} color={color} popup={<SelectedDocView selectedDocs={selectedDocs} />} fillWidth />;
+                        return (
+                            <Popup
+                                icon={<FontAwesomeIcon size={'1x'} icon={icon} />}
+                                text={text}
+                                type={Type.TERT}
+                                color={SettingsManager.userColor}
+                                background={SettingsManager.userVariantColor}
+                                popup={<SelectedDocView selectedDocs={selectedDocs} />}
+                                fillWidth
+                            />
+                        );
                     }
                 } else {
                     dropdown = false;
-                    return <Button text={`None Selected`} type={Type.TERT} color={color} fillWidth inactive />;
+                    return <Button text="None Selected" type={Type.TERT} color={SettingsManager.userColor} background={SettingsManager.userVariantColor} fillWidth inactive />;
                 }
                 noviceList = [CollectionViewType.Freeform, CollectionViewType.Schema, CollectionViewType.Stacking, CollectionViewType.NoteTaking];
             } else {
@@ -235,16 +243,19 @@ export class FontIconBox extends DocComponent<ButtonProps>() {
             }));
 
         return (
-            <Dropdown
-                selectedVal={text}
-                setSelectedVal={undoable(val => script.script.run({ this: this.layoutDoc, self: this.rootDoc, val }), `dropdown select ${this.label}`)}
-                color={color}
-                type={isViewDropdown ? Type.TERT : Type.PRIM}
-                dropdownType={DropdownType.SELECT}
-                items={list}
-                tooltip={this.label}
-                fillWidth
-            />
+            <div style={{ color: SettingsManager.userColor, background: SettingsManager.userBackgroundColor }}>
+                <Dropdown
+                    selectedVal={text}
+                    setSelectedVal={undoable(val => script.script.run({ this: this.layoutDoc, self: this.rootDoc, val }), `dropdown select ${this.label}`)}
+                    color={SettingsManager.userColor}
+                    background={isViewDropdown ? SettingsManager.userVariantColor : SettingsManager.userBackgroundColor}
+                    type={Type.TERT}
+                    dropdownType={DropdownType.SELECT}
+                    items={list}
+                    tooltip={this.label}
+                    fillWidth
+                />
+            </div>
         );
     }
 
@@ -276,6 +287,7 @@ export class FontIconBox extends DocComponent<ButtonProps>() {
                 selectedColor={curColor}
                 type={Type.PRIM}
                 color={color}
+                background={SettingsManager.userBackgroundColor}
                 icon={this.Icon(color)!}
                 tooltip={tooltip}
                 label={this.label}
@@ -296,6 +308,7 @@ export class FontIconBox extends DocComponent<ButtonProps>() {
                 tooltip={`Toggle ${tooltip}`}
                 type={Type.PRIM}
                 color={color}
+                background={SettingsManager.userBackgroundColor}
                 label={this.label}
                 items={DocListCast(this.rootDoc.data).map(item => ({
                     icon: <FontAwesomeIcon className={`fontIconBox-icon-${this.type}`} icon={StrCast(item.icon) as any} color={color} />,
@@ -330,6 +343,7 @@ export class FontIconBox extends DocComponent<ButtonProps>() {
                 toggleStatus={toggleStatus}
                 text={buttonText}
                 color={color}
+                background={SettingsManager.userBackgroundColor}
                 icon={this.Icon(color)!}
                 label={this.label}
                 onPointerDown={() => script.script.run({ this: this.layoutDoc, self: this.rootDoc, value: !toggleStatus, _readOnly_: false })}
@@ -386,8 +400,10 @@ export class FontIconBox extends DocComponent<ButtonProps>() {
             case ButtonType.ToggleButton:       return this.toggleButton;
             case ButtonType.ClickButton:
             case ButtonType.ToolButton: return <IconButton {...btnProps} size={Size.LARGE} color={color} />;
-            case ButtonType.TextButton: return <Button     {...btnProps} text={StrCast(this.rootDoc.buttonText)}/>;
-            case ButtonType.MenuButton: return <IconButton {...btnProps} color={color}  size={Size.LARGE} tooltipPlacement='right' onPointerDown={scriptFunc} />; 
+            case ButtonType.TextButton: return <Button     {...btnProps} color={color} 
+            background={SettingsManager.userBackgroundColor} text={StrCast(this.rootDoc.buttonText)}/>;
+            case ButtonType.MenuButton: return <IconButton {...btnProps} color={color} 
+            background={SettingsManager.userBackgroundColor}  size={Size.LARGE} tooltipPlacement='right' onPointerDown={scriptFunc} />; 
         }
         return this.defaultButton;
     }
-- 
cgit v1.2.3-70-g09d2