vuetifyjs/vuetify

[Feature Request] Add Drag and Drop Visual Feedback to `v-file-input` Component.

Open

#20.576 aperta il 14 ott 2024

Vedi su GitHub
 (1 commento) (3 reazioni) (0 assegnatari)TypeScript (7139 fork)batch import
C: New ComponentT: featuregood first issue

Metriche repository

Star
 (40.995 star)
Metriche merge PR
 (Merge medio 59g 10h) (8 PR mergiate in 30 g)

Descrizione

Problem to solve

When local files are dragged onto the v-input-file component, there is an absence of clear visual feedback, which might cause confusion. Users will not be certain whether drag and drop functionality is operational.

Proposed solution

I propose adding visual changes, such as a distinct border color when a file is being dragged over the input area, similar to what the Quasar framework does. This would render it more intuitive for users.

image

Guida contributor

Direzione di ricerca
Esamina il codice sorgente del componente `v file input` esistente in Vuetify per capire come vengono attualmente gestiti (o non gestiti) gli eventi di trascinamento. Implementa un feedback visivo aggiungendo classi CSS agli eventi `dragenter`, `dragover` e `dragleave` per cambiare il colore o lo stile del bordo. Testa localmente.
Tech stack
typescriptvue
Dominio
frontend
Tipo issue
Funzionalità
DifficoltàQuanto dovrebbe essere impegnativa per un nuovo contributor.
2
Tempo stimatoTempo stimato per completare e verificare uno scope piccolo.
1-3 ore
Stato attivitàQuanto è probabile che la issue sia ancora attiva e reviewable.
Attiva
ChiarezzaQuanto chiaramente la issue descrive problema, scope e risultato atteso.
Chiara
Prerequisiti
VueVuetifyCSS
Adatta ai principiantiQuanto la issue è adatta a contributor alla prima esperienza.
75