Replace heymlz animation

This commit is contained in:
marzban-dev
2025-04-26 20:41:03 +03:30
parent 754c04d887
commit 6670a8abac
3 changed files with 25 additions and 7 deletions
+2 -2
View File
@@ -28,11 +28,11 @@ const onSwiper = (swiper: SwiperClass) => {
<div class="w-full mt-44 lg:mt-64 relative">
<NuxtImg
class="aspect-square w-[210px] sm:w-[240px] md:w-[300px] lg:w-[350px] translate-y-[-164px] md:translate-y-[-206px] lg:translate-y-[-240px] absolute left-1/2 -translate-x-1/2 z-10"
class="aspect-square w-[210px] sm:w-[240px] md:w-[300px] lg:w-[350px] translate-y-[-136px] sm:translate-y-[-156px] md:translate-y-[-195px] lg:translate-y-[-228px] absolute left-1/2 -translate-x-1/2 z-10"
:style="{
filter: 'drop-shadow(0px 0px 20px rgba(0, 0, 0, 0.4))',
}"
src="/img/heymlz/heymlz-seat.gif"
src="/img/heymlz/heymlz-category-seat.gif"
/>
<Swiper
:loop="true"
+23 -5
View File
@@ -242,7 +242,10 @@ onUnmounted(() => {
/>
</button>
</div>
<NuxtLink :to="slide.link" class="typo-h-6 md:typo-h-4 lg:typo-h-1 tracking-[-2px] text-white">
<NuxtLink
:to="slide.link"
class="typo-h-6 md:typo-h-4 lg:typo-h-1 tracking-[-2px] text-white"
>
{{ slide.title }}
</NuxtLink>
</div>
@@ -250,10 +253,21 @@ onUnmounted(() => {
<span class="truncate typo-p-xs md:typo-p-sm lg:typo-p-lg text-white">
{{ slide.description }}
</span>
<NuxtLink :to="slide.link">
<NuxtLink
:to="slide.link"
class="relative max-sm:hidden"
>
<NuxtImg
class="aspect-square w-[110px] lg:w-[120px] translate-y-[-75px] lg:translate-y-[-82px] absolute left-1/2 -translate-x-1/2 z-10"
:style="{
filter: 'drop-shadow(0px 0px 20px rgba(0, 0, 0, 0.4))',
}"
src="/img/heymlz/heymlz-seat.gif"
/>
<Button
variant="primary"
class="max-sm:hidden max-lg:typo-label-xs px-7 rounded-full hover:bg-transparent"
class="max-lg:typo-label-xs px-12 rounded-full hover:bg-blue-500 hover:text-white"
>
مشاهده
</Button>
@@ -270,7 +284,9 @@ onUnmounted(() => {
@click="swiper_instance?.slidePrev()"
class="relative"
>
<div class="size-8 blur-xl bg-white absolute ping-animation max-sm:hidden"></div>
<div
class="size-8 blur-xl bg-white absolute ping-animation max-sm:hidden"
></div>
<Icon
class="**:stroke-white cursor-pointer size-6 md:size-8"
name="ci:arrow-right"
@@ -289,7 +305,9 @@ onUnmounted(() => {
@click="swiper_instance?.slideNext()"
class="relative"
>
<div class="size-8 blur-xl bg-white absolute ping-animation max-sm:hidden"></div>
<div
class="size-8 blur-xl bg-white absolute ping-animation max-sm:hidden"
></div>
<Icon
class="**:stroke-white cursor-pointer size-6 md:size-8"
name="ci:arrow-left"