Skip to content

Commit 45f30df

Browse files
committed
style: improve image upload button layout and styling for better user experience
1 parent 8f9ce7d commit 45f30df

File tree

1 file changed

+4
-2
lines changed

1 file changed

+4
-2
lines changed

custom/imageGenerator.vue

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -65,8 +65,10 @@
6565
accept="image/*"
6666
/>
6767
<button v-if="!uploading" @click="fileInput?.click()" type="button" class="relative group hover:border-gray-500 transition border-gray-300 flex items-center justify-center w-20 h-20 border-2 border-dashed rounded-md">
68-
<IconCloseOutline class="group-hover:text-gray-500 transition rotate-45 w-10 h-10 text-gray-300 hover:text-gray-300" />
69-
<p class="text-gray-300 group-hover:text-gray-500 transition absolute bottom-0">Ctrl + v</p>
68+
<div class="flex flex-col items-center justify-center gap-2 mt-4 mb-4">
69+
<IconCloseOutline class="group-hover:text-gray-500 transition rotate-45 w-6 h-6 text-gray-300 hover:text-gray-300" />
70+
<p class="text-gray-300 group-hover:text-gray-500 transition bottom-0">Ctrl + v</p>
71+
</div>
7072
</button>
7173
<Skeleton v-else type="image" class="w-20 h-20" />
7274
</div>

0 commit comments

Comments
 (0)