diff options
Diffstat (limited to 'src/client/views')
4 files changed, 23 insertions, 8 deletions
diff --git a/src/client/views/nodes/button/FontIconBadge.scss b/src/client/views/nodes/button/FontIconBadge.scss new file mode 100644 index 000000000..78f506e57 --- /dev/null +++ b/src/client/views/nodes/button/FontIconBadge.scss @@ -0,0 +1,11 @@ +.fontIconBadge { + background: red; + width: 15px; + height: 15px; + top: 8px; + display: block; + position: absolute; + right: 5; + border-radius: 50%; + text-align: center; +}
\ No newline at end of file diff --git a/src/client/views/nodes/button/FontIconBadge.tsx b/src/client/views/nodes/button/FontIconBadge.tsx index 3e451eea6..cf86b5e07 100644 --- a/src/client/views/nodes/button/FontIconBadge.tsx +++ b/src/client/views/nodes/button/FontIconBadge.tsx @@ -1,9 +1,10 @@ import { observer } from "mobx-react"; -import React from "react"; +import * as React from "react"; import { AclPrivate, Doc, DocListCast } from "../../../../fields/Doc"; import { GetEffectiveAcl } from "../../../../fields/util"; import { emptyFunction, returnFalse, setupMoveUpEvents } from "../../../../Utils"; import { DragManager } from "../../../util/DragManager"; +import "./FontIconBadge.scss"; interface FontIconBadgeProps { collection: Doc | undefined; @@ -26,7 +27,7 @@ export class FontIconBadge extends React.Component<FontIconBadgeProps> { render() { if (!(this.props.collection instanceof Doc)) return (null); const length = DocListCast(this.props.collection.data).filter(d => GetEffectiveAcl(d) !== AclPrivate).length; // Object.keys(d).length).length; // filter out any documents that we can't read - return <div className="fontIconBadge-container" style={{ width: 15, height: 15, top: 12 }} ref={this._notifsRef}> + return <div className="fontIconBadge-container" ref={this._notifsRef}> <div className="fontIconBadge" style={length > 0 ? { "display": "initial" } : { "display": "none" }} onPointerDown={this.onPointerDown} > {length} diff --git a/src/client/views/nodes/button/FontIconBox.tsx b/src/client/views/nodes/button/FontIconBox.tsx index 96db929eb..fbb336445 100644 --- a/src/client/views/nodes/button/FontIconBox.tsx +++ b/src/client/views/nodes/button/FontIconBox.tsx @@ -25,11 +25,12 @@ import { Colors } from '../../global/globalEnums'; import { SetActiveInkColor } from '../../InkingStroke'; import { StyleProp } from '../../StyleProvider'; import { FieldView, FieldViewProps } from '.././FieldView'; -import './FontIconBox.scss'; import { RichTextMenu } from '../formattedText/RichTextMenu'; import { TextButton } from './textButton'; import { ToggleButton } from './toggleButton'; import { IButtonProps } from './ButtonInterface'; +import { FontIconBadge } from './FontIconBadge'; +import './FontIconBox.scss'; const FontIconSchema = createSchema({ icon: "string", }); @@ -180,6 +181,7 @@ export class FontIconBox extends DocComponent<ButtonProps, FontIconDocument>(Fon <div className={`button`} onClick={action((e) => setValue(checkResult + 1))}> <FontAwesomeIcon className={`fontIconBox-icon-${this.type}`} icon={"plus"} /> </div> + {this.rootDoc.dropDownOpen ? <div> <div className="menuButton-dropdownList" @@ -559,6 +561,7 @@ export class FontIconBox extends DocComponent<ButtonProps, FontIconDocument>(Fon <div className={`menuButton ${this.type}`} style={{ color: color, backgroundColor: backgroundColor }}> <FontAwesomeIcon className={`fontIconBox-icon-${this.type}`} icon={this.icon} color={color} /> {menuLabel} + <FontIconBadge collection={Cast(this.rootDoc.watchedDocuments, Doc, null)} /> </div > ); break; diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index a9beb67de..f45b9de7a 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -1451,11 +1451,11 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp const setScrollHeight = () => this.rootDoc[this.fieldKey + "-scrollHeight"] = scrollHeight; if (this.rootDoc === this.layoutDoc.doc || this.layoutDoc.resolvedDataDoc) { setScrollHeight(); - setTimeout(() => { - proseHeight = !this.ProseRef ? 0 : children.reduce((p, child) => p + Number(getComputedStyle(child).height.replace("px", "")), margins); - scrollHeight = this.ProseRef && Math.min(NumCast(this.layoutDoc.docMaxAutoHeight, proseHeight), proseHeight); - scrollHeight && setScrollHeight(); - }, 10); + // setTimeout(() => { + // proseHeight = !this.ProseRef ? 0 : children.reduce((p, child) => p + Number(getComputedStyle(child).height.replace("px", "")), margins); + // scrollHeight = this.ProseRef && Math.min(NumCast(this.layoutDoc.docMaxAutoHeight, proseHeight), proseHeight); + // scrollHeight && setScrollHeight(); + // }, 10); } else setTimeout(setScrollHeight, 10); // if we have a template that hasn't been resolved yet, we can't set the height or we'd be setting it on the unresolved template. So set a timeout and hope its arrived... } } |