fixed resizing height to 0 to autoResize. fixed setting background color default for equations (and everything else) to textBackgroundColor from user doc. Added a math pseudo-font to trigger entering equations instead of rich text.

1 files changed, 11 insertions, 3 deletions

diff --git a/src/client/views/nodes/EquationBox.tsx b/src/client/views/nodes/EquationBox.tsx
index 34b46381d..572178f0c 100644
--- a/src/client/views/nodes/EquationBox.tsx
+++ b/src/client/views/nodes/EquationBox.tsx
@@ -1,4 +1,4 @@
-import { action, makeObservable, reaction } from 'mobx';
+import { action, computed, makeObservable, reaction } from 'mobx';
 import { observer } from 'mobx-react';
 import * as React from 'react';
 import { DivHeight, DivWidth } from '../../../ClientUtils';
@@ -14,6 +14,7 @@ import { DocumentView } from './DocumentView';
 import './EquationBox.scss';
 import { FieldView, FieldViewProps } from './FieldView';
 import EquationEditor from './formattedText/EquationEditor';
+import { StyleProp } from '../StyleProp';
 
 @observer
 export class EquationBox extends ViewBoxBaseComponent<FieldViewProps>() {
@@ -56,6 +57,8 @@ export class EquationBox extends ViewBoxBaseComponent<FieldViewProps>() {
             { fireImmediately: true }
         );
     }
+    @computed get fontSize()       { return this._props.styleProvider?.(this.layoutDoc, this._props, StyleProp.FontSize) as string; } // prettier-ignore
+    @computed get fontColor()      { return this._props.styleProvider?.(this.layoutDoc, this._props, StyleProp.FontColor) as string; } // prettier-ignore
 
     @action
     keyPressed = (e: KeyboardEvent) => {
@@ -68,6 +71,9 @@ export class EquationBox extends ViewBoxBaseComponent<FieldViewProps>() {
                 _height: 25,
                 x: NumCast(this.layoutDoc.x),
                 y: NumCast(this.layoutDoc.y) + _height + 10,
+                backgroundColor: StrCast(this.Document.backgroundColor),
+                color: StrCast(this.Document.color),
+                fontSize: this.fontSize,
             });
             Doc.SetSelectOnLoad(nextEq);
             this._props.addDocument?.(nextEq);
@@ -118,10 +124,12 @@ export class EquationBox extends ViewBoxBaseComponent<FieldViewProps>() {
                 className="equationBox-cont"
                 onPointerDown={e => !e.ctrlKey && e.stopPropagation()}
                 style={{
+                    minWidth: `${100 / scale}%`,
                     transform: `scale(${scale})`,
                     height: `${100 / scale}%`,
                     pointerEvents: !this._props.isSelected() ? 'none' : undefined,
-                    fontSize: StrCast(this.Document._text_fontSize),
+                    fontSize: this.fontSize,
+                    color: this.fontColor,
                 }}
                 onKeyDown={e => e.stopPropagation()}>
                 <EquationEditor ref={this._ref} value={StrCast(this.dataDoc.text, 'x')} spaceBehavesLikeTab onChange={this.onChange} autoCommands="pi theta sqrt sum prod alpha beta gamma rho" autoOperatorNames="sin cos tan" />
@@ -132,5 +140,5 @@ export class EquationBox extends ViewBoxBaseComponent<FieldViewProps>() {
 
 Docs.Prototypes.TemplateMap.set(DocumentType.EQUATION, {
     layout: { view: EquationBox, dataField: 'text' },
-    options: { acl: '', fontSize: '14px', _layout_reflowHorizontal: true, _layout_reflowVertical: true, _layout_nativeDimEditable: true, layout_hideDecorationTitle: true, systemIcon: 'BsCalculatorFill' }, // systemIcon: 'BsSuperscript' + BsSubscript
+    options: { acl: '', fontSize: '14px', _nativeWidth: 35, _nativeHeight: 35, _layout_reflowHorizontal: false, _layout_reflowVertical: false, _layout_nativeDimEditable: false, layout_hideDecorationTitle: true, systemIcon: 'BsCalculatorFill' }, // systemIcon: 'BsSuperscript' + BsSubscript
 });