attic/fling
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Fix mobile layout for upload

Browse source 
Upload and file-list tiles appeared side-by-side even on small viewports.

Upload and file-list tiles are now full width on small viewports.
This commit is contained in:
Armin Friedl 2020-05-22 08:30:06 +02:00
parent b0a7e8b443
commit 4ca4fe5ffe
Signed by: armin
GPG key ID: 48C726EEE7FBCBC8
1 changed files with 7 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
web/fling/src/components/admin/Upload.jsx
View file

@ -138,9 +138,9 @@ export default function Upload(props) {
return(
<>
<img className="dropzone-icon" alt="dropzone icon" src={drop}
onDragOver={stopEvent} onDragLeave={stopEvent} />
onDragLeave={stopEvent} />
<h5 className="text-primary"
onDragOver={stopEvent} onDragLeave={stopEvent}>
onDragLeave={stopEvent}>
Drop now!
</h5>
</>
@ -149,8 +149,8 @@ export default function Upload(props) {
return(
<>
<img className="dropzone-icon-upload" alt="dropzone icon" src={upload}
onDragOver={stopEvent} onDragLeave={stopEvent} />
<h5 onDragOver={stopEvent} onDragLeave={stopEvent}>
onDragLeave={stopEvent} />
<h5 onDragLeave={stopEvent}>
Click or Drop
</h5>
</>
@ -162,21 +162,21 @@ export default function Upload(props) {
<div className="container">
{logFiles()}
<div className="columns">
<div className="column col-4 pl-0"
<div className="column col-4 col-sm-12"
onDrop={handleDrop}
onClick={handleClick}
onDragOver={stopEvent}
onDragEnter={handleOnDragEnter}
onDragLeave={handleOnDragLeave}>
<div className="dropzone c-hand py-2" onDragLeave={stopEvent} >
<div className="dropzone c-hand py-2" >
<input className="d-hide" ref={fileInputRef} type="file" multiple
onDragLeave={stopEvent} onChange={handleFileInputChange} />
{zoneContent(dragging)}
</div>
</div>
<div className="column col-8 pr-0" >
<div className="column col-8 col-sm-12" >
<div className="file-list">
<div className="row">
<div className="container">