Add changes to preview slider

This commit is contained in:
marzban-dev
2025-03-27 15:16:41 +03:30
parent 0c10cb4e18
commit 42a0df7b88
+18 -11
View File
@@ -51,8 +51,8 @@ watch(
<div class="flex flex-col items-center gap-3 mb-10 lg:mb-16"> <div class="flex flex-col items-center gap-3 mb-10 lg:mb-16">
<span class="typo-p-sm md:typo-p-md text-slate-500">مقایسه محصولات</span> <span class="typo-p-sm md:typo-p-md text-slate-500">مقایسه محصولات</span>
<span class="typo-h-6 md:typo-h-5 lg:typo-h-3 text-black"> <span class="typo-h-6 md:typo-h-5 lg:typo-h-3 text-black">
تفاوت محصلات ما را ببینید تفاوت محصلات ما را ببینید
</span> </span>
</div> </div>
<div <div
ref="previewContainerEl" ref="previewContainerEl"
@@ -113,7 +113,8 @@ watch(
:style="{ :style="{
left: `${clipPathPercent}%`, left: `${clipPathPercent}%`,
}" }"
class="select-none w-2 h-full bg-black absolute left-0 flex items-center justify-center" :class="activeSlideVideo !== 'none' ? 'opacity-10' : ''"
class="select-none w-2 h-full bg-black absolute left-0 flex items-center justify-center transition-opacity"
> >
<div <div
@@ -132,10 +133,13 @@ watch(
<div <div
class="max-xs:hidden absolute bottom-0 p-6 md:p-10 w-full flex justify-between items-end" class="max-xs:hidden absolute bottom-0 p-6 md:p-10 w-full flex justify-between items-end"
> >
<div class="flex flex-col gap-2 text-black"> <div
<span class="typo-p-sm md:typo-p-md"> class="flex flex-col gap-2 text-black transition-opacity"
{{ homeData!.difreance_section.description1 }} :class="activeSlideVideo === 'right' ? 'opacity-0' : ''"
</span> >
<span class="typo-p-sm md:typo-p-md">
{{ homeData!.difreance_section.description1 }}
</span>
<NuxtLink <NuxtLink
:to="homeData!.difreance_section.link1" :to="homeData!.difreance_section.link1"
class="typo-h-6 md:typo-h-5 lg:typo-h-3" class="typo-h-6 md:typo-h-5 lg:typo-h-3"
@@ -143,10 +147,13 @@ watch(
{{ homeData!.difreance_section.title1 }} {{ homeData!.difreance_section.title1 }}
</NuxtLink> </NuxtLink>
</div> </div>
<div class="flex flex-col gap-2 text-black"> <div
<span class="typo-p-sm md:typo-p-md text-end"> class="flex flex-col gap-2 text-black transition-opacity"
{{ homeData!.difreance_section.description2 }} :class="activeSlideVideo === 'left' ? 'opacity-0' : ''"
</span> >
<span class="typo-p-sm md:typo-p-md text-end">
{{ homeData!.difreance_section.description2 }}
</span>
<NuxtLink <NuxtLink
:to="homeData!.difreance_section.link2" :to="homeData!.difreance_section.link2"
class="typo-h-6 md:typo-h-5 lg:typo-h-3 text-end" class="typo-h-6 md:typo-h-5 lg:typo-h-3 text-end"