diff options
author | bobzel <zzzman@gmail.com> | 2020-08-06 22:30:36 -0400 |
---|---|---|
committer | bobzel <zzzman@gmail.com> | 2020-08-06 22:30:36 -0400 |
commit | a1977d1ae00a4f0c3907eb243ba1c04a5acc5c62 (patch) | |
tree | 66bbd9b9b912c30f893c2204716ff8e4f9086019 /src/client/views/nodes/MenuIconBox.tsx | |
parent | 72b95c76f156a15f645703ba77c05aeb62c903ff (diff) | |
parent | 0910e7387fae485d7c11eb71b6abcce865403b13 (diff) |
Merge branch 'master' into new_audio
Diffstat (limited to 'src/client/views/nodes/MenuIconBox.tsx')
-rw-r--r-- | src/client/views/nodes/MenuIconBox.tsx | 33 |
1 files changed, 33 insertions, 0 deletions
diff --git a/src/client/views/nodes/MenuIconBox.tsx b/src/client/views/nodes/MenuIconBox.tsx new file mode 100644 index 000000000..0aa7b327e --- /dev/null +++ b/src/client/views/nodes/MenuIconBox.tsx @@ -0,0 +1,33 @@ +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { observer } from 'mobx-react'; +import * as React from 'react'; +import { createSchema, makeInterface } from '../../../fields/Schema'; +import { StrCast } from '../../../fields/Types'; +import { DocComponent } from '../DocComponent'; +import { FieldView, FieldViewProps } from './FieldView'; +import './MenuIconBox.scss'; +const MenuIconSchema = createSchema({ + icon: "string" +}); + +type MenuIconDocument = makeInterface<[typeof MenuIconSchema]>; +const MenuIconDocument = makeInterface(MenuIconSchema); +@observer +export class MenuIconBox extends DocComponent<FieldViewProps, MenuIconDocument>(MenuIconDocument) { + public static LayoutString(fieldKey: string) { return FieldView.LayoutString(MenuIconBox, fieldKey); } + _ref: React.RefObject<HTMLButtonElement> = React.createRef(); + + render() { + + const color = this.props.backgroundColor?.(this.props.Document) === "lightgrey" ? "black" : "white"; + const menuBTN = <div className="menuButton" style={{ backgroundColor: this.props.backgroundColor?.(this.props.Document) }}> + <div className="menuButton-wrap" + style={{ backgroundColor: this.props.backgroundColor?.(this.props.Document) }} > + <FontAwesomeIcon className="menuButton-icon" icon={StrCast(this.dataDoc.icon, "user") as any} color={color} size="lg" /> + <div className="menuButton-label" style={{ color: color }}> {this.dataDoc.title} </div> + </div> + </div>; + + return menuBTN; + } +}
\ No newline at end of file |