add keyboard support (#61)

altai-ui · Feb 9, 2021 · dc28fc7 · dc28fc7
1 parent fbb1eea
commit dc28fc7
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 1 deletion.
diff --git a/src/qComponents/QUpload/src/QUpload.vue b/src/qComponents/QUpload/src/QUpload.vue
@@ -3,11 +3,13 @@
     <div
       class="q-upload-drag"
       :class="classes"
+      tabindex="0"
       @dragenter.prevent
       @drop.prevent="processFile"
       @dragover.prevent="handleDragover"
       @dragleave.prevent="isDragover = false"
       @click="handleUploadClick"
+      @keyup.enter="handleUploadClick"
     >
       <span
         class="q-upload-drag__icon"
@@ -21,6 +23,7 @@
       class="q-upload__input"
       type="file"
       :accept="accept.toString()"
+      tabindex="-1"
       @change="processFile"
     />
 

diff --git a/src/qComponents/QUpload/src/q-upload.scss b/src/qComponents/QUpload/src/q-upload.scss
@@ -36,7 +36,8 @@
   box-shadow: var(--box-shadow);
   cursor: pointer;
 
-  &:hover {
+  &:hover,
+  &[data-focus-visible-added] {
     --background-color: var(--color-tertiary-gray);
     --box-shadow: var(--box-shadow-hover);
   }