LBRYCommunity/spee.ch
1
0
Fork 0
Code Issues95 Pull requests 2 Projects Releases 4 Packages Wiki Activity

fixed css so dropzone is full screen

Browse source
This commit is contained in:
bill bittner 2018-01-04 12:04:23 -08:00
parent c62a9c479e
commit 4028601897
4 changed files with 7 additions and 7 deletions
public/bundle
bundle.js
react
components
dropzone.jsx
uploader.js
views
index.handlebars

6
public/bundle/bundle.js
View file

@ -1034,7 +1034,7 @@ var Uploader = function (_React$Component) {
value: function render() { value: function render() {
return _react2.default.createElement( return _react2.default.createElement(
'div', 'div',
{ className: 'row row--tall' }, { className: 'row row--tall flex-container--column' },
this.state.showComponent === DROPZONE && _react2.default.createElement(_dropzone2.default, { stageFileAndShowDetails: this.stageFileAndShowDetails }), this.state.showComponent === DROPZONE && _react2.default.createElement(_dropzone2.default, { stageFileAndShowDetails: this.stageFileAndShowDetails }),
this.state.showComponent === DETAILS && _react2.default.createElement(_publishDetails2.default, { this.state.showComponent === DETAILS && _react2.default.createElement(_publishDetails2.default, {
updateUploaderState: this.updateUploaderState, updateUploaderState: this.updateUploaderState,
@ -18527,7 +18527,7 @@ var Dropzone = function (_React$Component) {
value: function render() { value: function render() {
return _react2.default.createElement( return _react2.default.createElement(
'div', 'div',
{ className: 'row row--tall' }, { className: 'row row--tall flex-container--column' },
_react2.default.createElement( _react2.default.createElement(
'form', 'form',
null, null,
@ -18535,7 +18535,7 @@ var Dropzone = function (_React$Component) {
), ),
_react2.default.createElement( _react2.default.createElement(
'div', 'div',
{ id: 'primary-dropzone', className: 'dropzone row row--padded row--tall flex-container--column flex-container--center-center' + (this.state.dragOver && ' dropzone--drag-over'), 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' + (this.state.dragOver ? ' dropzone--drag-over' : ''), onDrop: this.handleDrop, onDragOver: this.handleDragOver, onDragEnd: this.handleDragEnd, onDragEnter: this.handleDragEnter, onDragLeave: this.handleDragLeave, onClick: this.handleClick },
this.state.dragOver ? _react2.default.createElement( this.state.dragOver ? _react2.default.createElement(
'div', 'div',
{ id: 'dropbzone-dragover' }, { id: 'dropbzone-dragover' },

4
react/components/dropzone.jsx
View file

@ -112,11 +112,11 @@ class Dropzone extends React.Component {
} }
render () { render () {
return ( return (
<div className="row row--tall"> <div className="row row--tall flex-container--column">
<form> <form>
<input className="input-file" type="file" id="file_input" name="file_input" accept="video/*,image/*" onChange={this.handleFileInput} encType="multipart/form-data"/> <input className="input-file" type="file" id="file_input" name="file_input" accept="video/*,image/*" onChange={this.handleFileInput} encType="multipart/form-data"/>
</form> </form>
<div id="primary-dropzone" className={'dropzone row row--padded row--tall flex-container--column flex-container--center-center' + (this.state.dragOver && ' dropzone--drag-over')} 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' + (this.state.dragOver ? ' dropzone--drag-over' : '')} onDrop={this.handleDrop} onDragOver={this.handleDragOver} onDragEnd={this.handleDragEnd} onDragEnter={this.handleDragEnter} onDragLeave={this.handleDragLeave} onClick={this.handleClick}>
{ this.state.dragOver ? ( { this.state.dragOver ? (
<div id="dropbzone-dragover"> <div id="dropbzone-dragover">
<p className="blue">Drop it.</p> <p className="blue">Drop it.</p>

2
react/uploader.js
View file

@ -48,7 +48,7 @@ class Uploader extends React.Component {
} }
render () { render () {
return ( return (
<div className="row row--tall"> <div className="row row--tall flex-container--column">
{ this.state.showComponent === DROPZONE && { this.state.showComponent === DROPZONE &&
<Dropzone stageFileAndShowDetails={this.stageFileAndShowDetails}/> <Dropzone stageFileAndShowDetails={this.stageFileAndShowDetails}/>
} }

2
views/index.handlebars
View file

@ -1,5 +1,5 @@
<div class="row row--tall flex-container--column"> <div class="row row--tall flex-container--column">
<div id="react-uploader" class="row row--padded row--tall"> <div id="react-uploader" class="row row--padded row--tall flex-container--column">
<div class="row row--padded row--tall flex-container--column flex-container--center-center"> <div class="row row--padded row--tall flex-container--column flex-container--center-center">
<img src="/assets/img/loading.gif" alt="loading"> <img src="/assets/img/loading.gif" alt="loading">
</div> </div>