diff --git a/client/scss/_dropzone.scss b/client/scss/_dropzone.scss index 3c5feb35..a3934edd 100644 --- a/client/scss/_dropzone.scss +++ b/client/scss/_dropzone.scss @@ -73,6 +73,12 @@ z-index: 3; } +.dropzone-memeify-saveMessage { + padding-top: .25em; + position: relative; + top: .5em; +} + .dropzone-memeify-toolbar { /* TODO: Cleanup `!important` */ background: $primary-color !important; diff --git a/client/src/components/Creatify/EditableFontface/index.js b/client/src/components/Creatify/EditableFontface/index.js index d2f0e18d..3c0da159 100644 --- a/client/src/components/Creatify/EditableFontface/index.js +++ b/client/src/components/Creatify/EditableFontface/index.js @@ -7,32 +7,48 @@ export default class EditableFontface extends Component { super(props); this.state = { + blinkSelection: props.blinkSelection == false ? false : true, value: props.value, }; + + this.textInput = React.createRef(); + } + + componentDidMount() { + const textInput = this.textInput.current; + + if(textInput) { + textInput.focus(); + } } render() { const me = this; const { + blinkSelection, value } = me.state; const { editable = true, fontFace, + preview, } = me.props; const textRender = fontFace.textRender || DEFAULT_TEXT_RENDER; const textStyles = Object.assign({ + ...(blinkSelection ? { + animation: 'textBlink 1s infinite', + } : {}), minHeight: '20px', WebkitFontSmoothing: 'antialiased', MozOsxFontSmoothing: 'grayscale', - }, fontFace.text); + }, fontFace.text, preview ? fontFace.previewOverrides : {}); const fontInput = (editable === true) ? ( - me.onKeyPress(e)} onChange={(e) => me.onChange(e)} style={{ + me.onKeyPress(e)} onChange={(e) => me.onChange(e)} style={{ ...{ bottom: 0, opacity: 0, @@ -49,25 +65,34 @@ export default class EditableFontface extends Component { return (
Video updates are currently disabled. This feature will be available soon. You can edit metadata.
) : (