Popup for delete button attached

app/templates/share.js

@@ -82,22 +82,23 @@ module.exports = function(state, emit) {
         class="btn"
         title="${state.translate('deleteFileButton')}"
         onclick=${showPopup}>${state.translate('deleteFileButton')}
-        <div class="popup">
+      </button>
+      <div id="deletePopup" class="popup">
          <div class="popuptext" onblur=${cancel} tabindex="-1">
-            <div class="popup-message">${state.translate(
-              'deletePopupText'
-            )}</div>
+           <div class="popup-message">${state.translate('deletePopupText')}
+           </div>
            <div class="popup-action">
              <span class="popup-no" onclick=${cancel}>${state.translate(
     'deletePopupCancel'
-  )}</span>
+  )}
+             </span>
              <span class="popup-yes" onclick=${deleteFile}>${state.translate(
     'deletePopupYes'
-  )}</span>
+  )}
+             </span>
            </div>
          </div>
       </div>
-      </button>
       <a class="send-new"
         data-state="completed"
         href="/"
@@ -113,7 +114,7 @@ module.exports = function(state, emit) {
 
   function cancel(e) {
     e.stopPropagation();
-    const popupText = e.target.parentElement.parentElement;
+    const popupText = document.querySelector('.popuptext');
     popupText.classList.remove('show');
   }
 

assets/main.css

@@ -636,6 +636,11 @@ tbody {
   color: #313131;
 }
 
+#deletePopup {
+  position: relative;
+  bottom: 50px;
+}
+
 #delete-file:hover {
   background: #efeff1;
 }