updated uploader css
This commit is contained in:
parent
ba5d532457
commit
6db3d1da19
5 changed files with 15 additions and 15 deletions
|
@ -1034,7 +1034,7 @@ var Uploader = function (_React$Component) {
|
|||
value: function render() {
|
||||
return _react2.default.createElement(
|
||||
'div',
|
||||
null,
|
||||
{ className: 'row row--tall' },
|
||||
this.state.showComponent === DROPZONE && _react2.default.createElement(_dropzone2.default, { stageFileAndShowDetails: this.stageFileAndShowDetails }),
|
||||
this.state.showComponent === DETAILS && _react2.default.createElement(_publishDetails2.default, {
|
||||
updateUploaderState: this.updateUploaderState,
|
||||
|
@ -18492,7 +18492,7 @@ var Dropzone = function (_React$Component) {
|
|||
key: 'handleDragEnter',
|
||||
value: function handleDragEnter() {
|
||||
var thisDropzone = document.getElementById('primary-dropzone');
|
||||
thisDropzone.setAttribute('class', 'dropzone dropzone--drag-over row row--margined row--padded row--tall flex-container--column flex-container--center-center');
|
||||
thisDropzone.setAttribute('class', 'dropzone dropzone--drag-over row row--padded row--tall flex-container--column flex-container--center-center');
|
||||
thisDropzone.firstElementChild.setAttribute('class', 'hidden');
|
||||
thisDropzone.lastElementChild.setAttribute('class', '');
|
||||
}
|
||||
|
@ -18500,7 +18500,7 @@ var Dropzone = function (_React$Component) {
|
|||
key: 'handleDragLeave',
|
||||
value: function handleDragLeave() {
|
||||
var thisDropzone = document.getElementById('primary-dropzone');
|
||||
thisDropzone.setAttribute('class', 'dropzone row row--tall row--margined row--padded flex-container--column flex-container--center-center');
|
||||
thisDropzone.setAttribute('class', 'dropzone row row--tall row--padded flex-container--column flex-container--center-center');
|
||||
thisDropzone.firstElementChild.setAttribute('class', '');
|
||||
thisDropzone.lastElementChild.setAttribute('class', 'hidden');
|
||||
}
|
||||
|
@ -18532,7 +18532,7 @@ var Dropzone = function (_React$Component) {
|
|||
value: function render() {
|
||||
return _react2.default.createElement(
|
||||
'div',
|
||||
null,
|
||||
{ className: 'row row--tall' },
|
||||
_react2.default.createElement(
|
||||
'form',
|
||||
null,
|
||||
|
@ -18540,7 +18540,7 @@ var Dropzone = function (_React$Component) {
|
|||
),
|
||||
_react2.default.createElement(
|
||||
'div',
|
||||
{ id: 'primary-dropzone', className: 'dropzone row row--margined row--padded row--tall flex-container--column flex-container--center-center', onDrop: this.handleDrop, onDragOver: this.handleDragOver, onDragEnd: this.handleDragEnd, onDragEnter: this.handleDragEnter, onDragLeave: this.handleDragLeave, onClick: this.handleClick },
|
||||
{ id: 'primary-dropzone', className: 'dropzone row row--padded row--tall flex-container--column flex-container--center-center', onDrop: this.handleDrop, onDragOver: this.handleDragOver, onDragEnd: this.handleDragEnd, onDragEnter: this.handleDragEnter, onDragLeave: this.handleDragLeave, onClick: this.handleClick },
|
||||
_react2.default.createElement(
|
||||
'div',
|
||||
{ id: 'primary-dropzone-instructions' },
|
||||
|
@ -18798,7 +18798,7 @@ var PublishDetails = function (_React$Component6) {
|
|||
value: function render() {
|
||||
return _react2.default.createElement(
|
||||
'div',
|
||||
{ className: 'row row--padded row--no-bottom' },
|
||||
{ className: 'row row--no-bottom' },
|
||||
_react2.default.createElement(
|
||||
'div',
|
||||
{ className: 'column column--10' },
|
||||
|
@ -18846,7 +18846,7 @@ var PublishDetails = function (_React$Component6) {
|
|||
{ className: 'row row--short align-content-center' },
|
||||
_react2.default.createElement(
|
||||
'button',
|
||||
{ className: 'button--cancel', onClick: this.cancelPublish },
|
||||
{ className: 'button--cancel', onClick: this.clearUploaderState },
|
||||
'Cancel'
|
||||
)
|
||||
),
|
||||
|
|
|
@ -86,13 +86,13 @@ class Dropzone extends React.Component {
|
|||
}
|
||||
handleDragEnter () {
|
||||
const thisDropzone = document.getElementById('primary-dropzone');
|
||||
thisDropzone.setAttribute('class', 'dropzone dropzone--drag-over row row--margined row--padded row--tall flex-container--column flex-container--center-center');
|
||||
thisDropzone.setAttribute('class', 'dropzone dropzone--drag-over row row--padded row--tall flex-container--column flex-container--center-center');
|
||||
thisDropzone.firstElementChild.setAttribute('class', 'hidden');
|
||||
thisDropzone.lastElementChild.setAttribute('class', '');
|
||||
}
|
||||
handleDragLeave () {
|
||||
const thisDropzone = document.getElementById('primary-dropzone');
|
||||
thisDropzone.setAttribute('class', 'dropzone row row--tall row--margined row--padded flex-container--column flex-container--center-center');
|
||||
thisDropzone.setAttribute('class', 'dropzone row row--tall row--padded flex-container--column flex-container--center-center');
|
||||
thisDropzone.firstElementChild.setAttribute('class', '');
|
||||
thisDropzone.lastElementChild.setAttribute('class', 'hidden');
|
||||
}
|
||||
|
@ -117,11 +117,11 @@ class Dropzone extends React.Component {
|
|||
}
|
||||
render () {
|
||||
return (
|
||||
<div>
|
||||
<div className="row row--tall">
|
||||
<form>
|
||||
<input className="input-file" type="file" id="file_input" name="file_input" accept="video/*,image/*" onChange={this.handleFileInput} encType="multipart/form-data"/>
|
||||
</form>
|
||||
<div id="primary-dropzone" className="dropzone row row--margined row--padded row--tall flex-container--column flex-container--center-center" onDrop={this.handleDrop} onDragOver={this.handleDragOver} onDragEnd={this.handleDragEnd} onDragEnter={this.handleDragEnter} onDragLeave={this.handleDragLeave} onClick={this.handleClick}>
|
||||
<div id="primary-dropzone" className="dropzone row row--padded row--tall flex-container--column flex-container--center-center" onDrop={this.handleDrop} onDragOver={this.handleDragOver} onDragEnd={this.handleDragEnd} onDragEnter={this.handleDragEnter} onDragLeave={this.handleDragLeave} onClick={this.handleClick}>
|
||||
<div id="primary-dropzone-instructions">
|
||||
<p className="info-message-placeholder info-message--failure" id="input-error-file-selection" hidden="true">{this.state.fileError}</p>
|
||||
<p>Drag & drop image or video here to publish</p>
|
||||
|
|
|
@ -89,7 +89,7 @@ class PublishDetails extends React.Component {
|
|||
}
|
||||
render () {
|
||||
return (
|
||||
<div className="row row--padded row--no-bottom">
|
||||
<div className="row row--no-bottom">
|
||||
<div className="column column--10">
|
||||
<Title title={this.props.title} updateUploaderState={this.updateUploaderState}/>
|
||||
</div>
|
||||
|
@ -115,7 +115,7 @@ class PublishDetails extends React.Component {
|
|||
</div>
|
||||
|
||||
<div className="row row--short align-content-center">
|
||||
<button className="button--cancel" onClick={this.cancelPublish}>Cancel</button>
|
||||
<button className="button--cancel" onClick={this.clearUploaderState}>Cancel</button>
|
||||
</div>
|
||||
|
||||
<div className="row row--short align-content-center">
|
||||
|
|
|
@ -48,7 +48,7 @@ class Uploader extends React.Component {
|
|||
}
|
||||
render () {
|
||||
return (
|
||||
<div>
|
||||
<div className="row row--tall">
|
||||
{ this.state.showComponent === DROPZONE &&
|
||||
<Dropzone stageFileAndShowDetails={this.stageFileAndShowDetails}/>
|
||||
}
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<div class="row row--tall flex-container--column">
|
||||
<div id="react-uploader"></div>
|
||||
<div id="react-uploader" class="row row--padded row--tall"></div>
|
||||
</div>
|
||||
|
||||
<script src="/bundle/bundle.js"></script>
|
||||
|
|
Loading…
Add table
Reference in a new issue