From 417c1b18261a87acb93ff0d455687e846947add0 Mon Sep 17 00:00:00 2001
From: waridrox <58583793+waridrox@users.noreply.github.com>
Date: Fri, 12 Mar 2021 09:54:49 +0530
Subject: [PATCH] Fixed buggy file upload container (#1841)

Co-authored-by: Jeffrey Warren <jeff@unterbahn.com>
---
 examples/demo.css      |  3 ++-
 src/ui/SetInputStep.js | 11 ++++++++---
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/examples/demo.css b/examples/demo.css
index 9c913ea7..6f2fcf2f 100644
--- a/examples/demo.css
+++ b/examples/demo.css
@@ -78,7 +78,8 @@ body > .container-fluid {
 }
 
 .hover {
-  background: #eee;
+  border: 4px dashed #888888;
+  background: #F0F0F0;
 }
 
 .step {
diff --git a/src/ui/SetInputStep.js b/src/ui/SetInputStep.js
index c4536bc7..052e9ff2 100644
--- a/src/ui/SetInputStep.js
+++ b/src/ui/SetInputStep.js
@@ -114,10 +114,10 @@ function setInputStepInit() {
     dropzone[0].addEventListener('drop', handleFile, false);
  
     dropzone.on('dragover', function onDragover(e) {
-      e.stopPropagation();
+      dropzone.addClass('hover');
       e.preventDefault();
-      e.dataTransfer.dropEffect = 'copy'; // Explicitly show this is a copy.
-    }, false);
+      e.stopPropagation();
+    });
  
     dropzone.on('dragenter', function onDragEnter(e) {
       dropzone.addClass('hover');
@@ -127,6 +127,11 @@ function setInputStepInit() {
       dropzone.removeClass('hover');
     });
 
+    dropzone.on('drop', function onDrop(e) {
+      dropzone.removeClass('hover');
+      e.preventDefault();
+    });
+
   };
 
 }