Update FileInputDefaultHoverModal

Author: AlttiRi

src/components/FileInputDefaultHoverModal.vue

@@ -11,23 +11,29 @@ defineProps<{
       data-component="FileInputDefaultHoverModal"
       class="file-input-hover-modal"
       :class="{'drop-hover': state.private.dropHover.value}"
-  ></div>
+  >
+    <div class="bottom-shadow"></div>
+  </div>
 </template>
 
 <style scoped>
 .file-input-hover-modal {
-  height: 50px;
+  height: 100%;
   width: 100%;
   position: fixed;
-  bottom: 0;
-  left: 0;
   pointer-events: none;
-  background-image: linear-gradient(to top, rgba(0,0,0,0.15), rgba(0,0,0,0.005));
-
   transition: opacity 0.25s ease-out;
   opacity: 0;
 }
 .file-input-hover-modal.drop-hover {
   opacity: 1;
 }
+.file-input-hover-modal .bottom-shadow {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  height: 50px;
+  width: 100%;
+  background-image: linear-gradient(to top, rgba(0,0,0,0.15), rgba(0,0,0,0.005));
+}
 </style>

src/components/FileInputSelectedInfo.vue

@@ -5,6 +5,7 @@
       <span class="file-size" :title="file.size.toString()">{{bytesToSizeWinLike(file.size)}}</span>
       <span class="file-mtime" v-if="file.mtime">{{dateToDayDateTimeString(file.mtime, false)}}</span>
     </span>
+    <span v-else-if="state.private.dropHover.value">Drop it</span>
     <span v-else>No file selected</span>
   </span>
 </template>