From fd2b58d96d5c5bed438f855227949690afbfa95f Mon Sep 17 00:00:00 2001
From: Danny Coates <dannycoates@gmail.com>
Date: Wed, 20 Feb 2019 10:59:05 -0800
Subject: [PATCH] made main "add files" area keyboard navible

---
 app/ui/archiveTile.js | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/app/ui/archiveTile.js b/app/ui/archiveTile.js
index d8720a93..ead9ce06 100644
--- a/app/ui/archiveTile.js
+++ b/app/ui/archiveTile.js
@@ -374,14 +374,16 @@ module.exports.empty = function(state, emit) {
       >
         ${state.translate('uploadDropDragMessage')}
       </div>
-      <div class="pb-6 text-center text-base italic">
+      <div class="text-center text-base italic">
         ${state.translate('uploadDropClickMessage')}
       </div>
       <input
         id="file-upload"
-        class="hidden"
+        class="opacity-0"
         type="file"
         multiple
+        onfocus="${focus}"
+        onblur="${blur}"
         onchange="${add}"
         onclick="${e => e.stopPropagation()}"
       />
@@ -396,6 +398,14 @@ module.exports.empty = function(state, emit) {
     </send-upload-area>
   `;
 
+  function focus(event) {
+    event.target.nextElementSibling.classList.add('bg-blue-darker');
+  }
+
+  function blur(event) {
+    event.target.nextElementSibling.classList.remove('bg-blue-darker');
+  }
+
   function add(event) {
     event.preventDefault();
     const newFiles = Array.from(event.target.files);