diff options
Diffstat (limited to 'src/mobile')
| -rw-r--r-- | src/mobile/ImageUpload.scss | 21 | ||||
| -rw-r--r-- | src/mobile/ImageUpload.tsx | 1 |
2 files changed, 20 insertions, 2 deletions
diff --git a/src/mobile/ImageUpload.scss b/src/mobile/ImageUpload.scss index d0b7d4e41..65305dd04 100644 --- a/src/mobile/ImageUpload.scss +++ b/src/mobile/ImageUpload.scss @@ -1,7 +1,13 @@ +@import "../client/views/globalCssVariables.scss"; + .imgupload_cont { - height: 100vh; + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; width: 100vw; - align-content: center; + height: 100vh; + .button_file { text-align: center; height: 50%; @@ -10,4 +16,15 @@ color: grey; font-size: 3em; } + + .upload_label { + width: 80vw; + height: 40vh; + background: $dark-color; + font-size: 10vw; + font-family: $sans-serif; + text-align: center; + padding-top: 20vh; + color: white; + } }
\ No newline at end of file diff --git a/src/mobile/ImageUpload.tsx b/src/mobile/ImageUpload.tsx index 690937339..84bbfeb14 100644 --- a/src/mobile/ImageUpload.tsx +++ b/src/mobile/ImageUpload.tsx @@ -71,6 +71,7 @@ const onFileLoad = async (file: React.ChangeEvent<HTMLInputElement>) => { ReactDOM.render(( <div className="imgupload_cont"> {/* <button className = "button_file" = {onPointerDown}> Open Image </button> */} + <label htmlFor="input_image_file" className="upload_label">Upload an Image</label> <input type="file" accept="image/*" onChange={onFileLoad} className="input_file" id="input_image_file"></input> <img id="img_preview" src=""></img> <div id="message" /> |