heymlz/hossein-por-shop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

responsived product card

Browse Source
This commit is contained in:
Mamalizz
2025-05-12 18:55:06 +03:30
parent 5764984e5e
commit 6b0355ae8e
1 changed files with 2 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/components/global/product/ProductCard.vue
+2 -2
View File
@@ -40,7 +40,7 @@ const limitedColors = computed(() => {
<NuxtLink :to="'/product/' + id">
<div class="@container group">
<div
class="group relative size-full aspect-square rounded-xl @[280px]:rounded-2xl bg-white brightness-[95%] overflow-hidden p-6"
class="group relative size-full aspect-square rounded-2xl bg-white brightness-[95%] overflow-hidden p-6"
>
<NuxtImg
:id="`product-image-${id}`"
@@ -69,7 +69,7 @@ const limitedColors = computed(() => {
class="absolute opacity-0 group-hover:opacity-100 bg-gradient-to-t transition-all group-hover:from-black/30 to-transparent inset-x-0 bottom-0 pb-4 @[280px]:pb-6 px-4 @[280px]:px-6 flex flex-row-reverse justify-between items-end z-10"
>
<div
class="items-center flex gap-2 @[280px]:mt-1 transition-all translate-y-1 group-hover:translate-y-0 "
class="items-center flex gap-2 @[280px]:mt-1 transition-all translate-y-1 group-hover:translate-y-0"
>
<ColorCircle
v-for="color in limitedColors"