1212 </button >
1313
1414 <label :for =" inputId"
15- class =" af-uploader flex flex-col px-3 items-center justify-center w-full h-64 border-2 border-dashed rounded-lg cursor-pointer dark:hover:bg-gray-800 hover:bg-gray-100 dark:hover:border-gray-500 dark:hover:bg-gray-600"
15+ class =" af-uploader flex flex-col px-3 items-center justify-center w-full h-64 border-2 border-dashed rounded-lg cursor-pointer dark:hover:! bg-darkDropzoneBackgroundHover dark:hover:bg- gray-800 hover:! bg-lightDropzoneBackgroundHover hover:bg- gray-100 dark:hover:! border-darkDropzoneBorderHover dark:hover:border- gray-500 dark:hover:! bg-darkDropzoneBackgroundHover dark:hover:bg- gray-600 hover:!border-lightDropzoneBorderHover "
1616 @dragover.prevent =" () => dragging = true"
1717 @dragleave.prevent =" () => dragging = false"
1818 @drop.prevent =" onFileChange"
1919 :class =" {
20- 'border-blue-600 dark:border-blue-400': dragging,
21- 'border-gray-300 dark:border-gray-600': !dragging,
22- 'bg-blue-50 dark:bg-blue-800': dragging,
23- 'bg-gray-50 dark:bg-gray-800': !dragging,
20+ 'border-blue-600 dark:border-blue-400 !border-lightDropzoneBorderDragging dark:!border-darkDropzoneBorderDragging ': dragging,
21+ 'border-gray-300 dark:border-gray-600 !border-lightDropzoneBorder dark:!border-darkDropzoneBorder ': !dragging,
22+ 'bg-blue-50 dark:bg-blue-800 !bg-lightDropzoneBackgroundDragging dark:!bg-darkDropzoneBackgroundDragging ': dragging,
23+ 'bg-gray-50 dark:bg-gray-800 !bg-lightDropzoneBackground dark:!bg-darkDropzoneBackground ': !dragging,
2424 }"
2525 >
2626 <div class =" flex flex-col items-center justify-center pt-5 pb-6" >
2727 <img v-if =" imgPreview" :src =" imgPreview" class =" w-100 mt-4 rounded-lg h-40 object-contain" />
2828
29- <svg v-else class =" w-8 h-8 mb-4 text-gray-500 dark:text-gray-400" aria-hidden =" true" xmlns =" http://www.w3.org/2000/svg" fill =" none" viewBox =" 0 0 20 16" >
29+ <svg v-else class =" w-8 h-8 mb-4 text-gray-500 dark:text-gray-400 !text-lightDropzoneText dark:!text-darkDropzoneText " aria-hidden =" true" xmlns =" http://www.w3.org/2000/svg" fill =" none" viewBox =" 0 0 20 16" >
3030 <path stroke =" currentColor" stroke-linecap =" round" stroke-linejoin =" round" stroke-width =" 2" d =" M13 13h3a3 3 0 0 0 0-6h-.025A5.56 5.56 0 0 0 16 6.5 5.5 5.5 0 0 0 5.207 5.021C5.137 5.017 5.071 5 5 5a4 4 0 0 0 0 8h2.167M10 15V6m0 0L8 8m2-2 2 2" />
3131 </svg >
3232
3333 <template v-if =" ! uploaded " >
34- <p class =" mb-2 text-sm text-gray-500 dark:text-gray-400" ><span class =" font-semibold" >{{ $t('Click to upload') }}</span > {{ $t('or drag and drop') }}</p >
35- <p class =" text-xs text-gray-500 dark:text-gray-400" >
34+ <p class =" mb-2 text-sm text-gray-500 dark:text-gray-400 !text-lightDropzoneText dark:!text-darkDropzoneText " ><span class =" font-semibold" >{{ $t('Click to upload') }}</span > {{ $t('or drag and drop') }}</p >
35+ <p class =" text-xs text-gray-500 dark:text-gray-400 !text-lightDropzoneText dark:!text-darkDropzoneText " >
3636 {{ allowedExtensionsLabel }} {{ meta.maxFileSize ? $t(`(up to {size})`, { size: humanifySize(meta.maxFileSize) }) : '' }}
3737 </p >
3838 </template >
5151 </svg >
5252 <p class =" ml-2 text-sm text-green-600 dark:text-green-400 flex items-center" >
5353 {{ $t('File uploaded') }}
54- <span class =" text-xs text-gray-500 dark:text-gray-400" >{{ humanifySize(uploadedSize) }}</span >
54+ <span class =" text-xs text-gray-500 dark:text-gray-400 !text-lightDropzoneText dark:!text-darkDropzoneText " >{{ humanifySize(uploadedSize) }}</span >
5555 </p >
5656
5757 <button @click.stop.prevent =" clear" class =" ml-2 text-xs text-gray-500 dark:text-gray-400 hover:text-gray-600 dark:hover:text-gray-500
58- hover:underline dark:hover:underline focus:outline-none" >{{ $t('Clear') }}</button >
58+ hover:underline dark:hover:underline focus:outline-none !text-lightDropzoneText hover:!text-lightDropzoneText dark:!text-darkDropzoneText dark:hover:!text-darkDropzoneText " >{{ $t('Clear') }}</button >
5959 </div >
6060
6161 </div >
@@ -72,7 +72,6 @@ import { IconMagic } from '@iconify-prerendered/vue-mdi';
7272import { useI18n } from ' vue-i18n' ;
7373import { useRoute } from ' vue-router' ;
7474
75-
7675const route = useRoute ();
7776const { t } = useI18n ();
7877
0 commit comments