From d0de00626ce91329e3e3ddd2b27c40f6f4548e12 Mon Sep 17 00:00:00 2001 From: marzban-dev Date: Thu, 17 Apr 2025 19:32:30 +0330 Subject: [PATCH 1/9] Add delay for preview section animation --- frontend/components/home/Preview.vue | 58 +++++++++------------------- 1 file changed, 18 insertions(+), 40 deletions(-) diff --git a/frontend/components/home/Preview.vue b/frontend/components/home/Preview.vue index bdaa9bf..0cb8e17 100644 --- a/frontend/components/home/Preview.vue +++ b/frontend/components/home/Preview.vue @@ -19,7 +19,7 @@ const heymlzElementIsVisible = useElementVisibility(heymlzElement, { rootMargin: "0px 0px -40% 0px", }); -const showHeymlzAnimation = ref(true); +const showHeymlzAnimation = ref(false); const { x: dragAxisX } = useDraggable(draggableEl, { initialValue: { x: 0, y: 0 }, @@ -32,10 +32,12 @@ watch( heymlzElementIsVisible, (newValue) => { if (newValue) { - showHeymlzAnimation.value = true; setTimeout(() => { - showHeymlzAnimation.value = false; - }, 3200); + showHeymlzAnimation.value = true; + setTimeout(() => { + showHeymlzAnimation.value = false; + }, 2900); + }, 400); } }, { @@ -61,9 +63,7 @@ watch( (newValue) => { const clientRect = previewContainerEl.value?.getBoundingClientRect()!; const percent = clientRect.width / 100; - const clipPercent = - (newValue + draggableEl.value!.clientWidth / 2 - clientRect.x - 8) / - percent; + const clipPercent = (newValue + draggableEl.value!.clientWidth / 2 - clientRect.x - 8) / percent; if (clipPercent >= 5 && clipPercent <= 95) { clipPathPercent.value = clipPercent; } @@ -75,12 +75,8 @@ watch(
- - مقایسه محصولات - - - تفاوت محصلات ما را ببینید - + مقایسه محصولات + تفاوت محصلات ما را ببینید
@@ -117,11 +109,7 @@ watch( @@ -136,7 +124,10 @@ watch( /> - +
@@ -220,11 +203,6 @@ watch( From 00b0b33e48de846ff45a565e7aa71cbf0961feb6 Mon Sep 17 00:00:00 2001 From: marzban-dev Date: Thu, 17 Apr 2025 19:56:37 +0330 Subject: [PATCH 2/9] Fix otp size in mobile and persian format --- frontend/components/global/OtpInput.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/components/global/OtpInput.vue b/frontend/components/global/OtpInput.vue index 923d144..7077c4d 100644 --- a/frontend/components/global/OtpInput.vue +++ b/frontend/components/global/OtpInput.vue @@ -131,7 +131,7 @@ watch(() => status.value, (value) => { :key="id" :index="index" :autofocus="autofocus ? index === 0 ? true : 'off' : 'off'" - class="disabled:text-slate-400 focus-within:border-black transition-all size-12 sm:size-16 bg-slate-50 typo-label-lg rounded-md sm:rounded-lg text-center border-[1.5px] border-slate-200 outline-none" + class="disabled:text-slate-400 persian-number focus-within:border-black transition-all size-10 sm:size-16 bg-slate-50 typo-label-lg rounded-sm sm:rounded-lg text-center border-[1.5px] border-slate-200 outline-none" />
From d54066c554555ba4ea88941067362a7168756028 Mon Sep 17 00:00:00 2001 From: marzban-dev Date: Thu, 17 Apr 2025 19:56:50 +0330 Subject: [PATCH 3/9] Add mask to footer gradient --- frontend/components/global/Footer.vue | 3 +++ 1 file changed, 3 insertions(+) diff --git a/frontend/components/global/Footer.vue b/frontend/components/global/Footer.vue index e8eb37d..54ff6d7 100644 --- a/frontend/components/global/Footer.vue +++ b/frontend/components/global/Footer.vue @@ -4,6 +4,9 @@ src="/img/footer-bg.jpg" alt="" class="absolute z-10 object-cover opacity-45" + :style="{ + mask: 'linear-gradient(to bottom, black 0%, rgba(0,0,0,0) 100%', + }" />
Date: Thu, 17 Apr 2025 19:56:59 +0330 Subject: [PATCH 4/9] Fix timeout --- frontend/components/home/Preview.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/components/home/Preview.vue b/frontend/components/home/Preview.vue index 0cb8e17..35f53a8 100644 --- a/frontend/components/home/Preview.vue +++ b/frontend/components/home/Preview.vue @@ -36,7 +36,7 @@ watch( showHeymlzAnimation.value = true; setTimeout(() => { showHeymlzAnimation.value = false; - }, 2900); + }, 3200); }, 400); } }, From e6012c4d5c29ca3c7f4db7072364b0b5dd2198cc Mon Sep 17 00:00:00 2001 From: marzban-dev Date: Thu, 17 Apr 2025 19:57:05 +0330 Subject: [PATCH 5/9] Updated --- frontend/components/home/Categories.vue | 15 ++------------- 1 file changed, 2 insertions(+), 13 deletions(-) diff --git a/frontend/components/home/Categories.vue b/frontend/components/home/Categories.vue index ca996a2..858dceb 100644 --- a/frontend/components/home/Categories.vue +++ b/frontend/components/home/Categories.vue @@ -22,19 +22,8 @@ const onSwiper = (swiper: SwiperClass) => { ref="sectionTarget" class="flex flex-col justify-center gap-4 bg-black h-[110svh] sm:h-[150svh] relative overflow-hidden" > -
-
- - دسته بندی ها - - -
+
+ دسته بندی ها
From 13b32b51044be959ce2902ab7e098dfcd4fba95b Mon Sep 17 00:00:00 2001 From: marzban-dev Date: Fri, 18 Apr 2025 13:13:13 +0330 Subject: [PATCH 6/9] Fix loading overlay bug --- frontend/components/global/LoadingOverlay.vue | 45 +++++++++++-------- 1 file changed, 27 insertions(+), 18 deletions(-) diff --git a/frontend/components/global/LoadingOverlay.vue b/frontend/components/global/LoadingOverlay.vue index 0421860..6000a58 100644 --- a/frontend/components/global/LoadingOverlay.vue +++ b/frontend/components/global/LoadingOverlay.vue @@ -7,6 +7,16 @@ const isSiteLoadingDisabled = useCookie("is-site-loading-disabled", { default: () => false, }); +watch( + isSiteLoadingDisabled, + (nv) => { + console.log(nv); + }, + { + immediate: true, + } +); + const shouldRenderLoadingOverlay = ref(true); const isAssetLoaded = ref(false); const criticalLoad = ref(true); @@ -27,8 +37,8 @@ const progressStyle = computed(() => { // methods const onAssetLoaded = () => { - criticalLoad.value = false; clearInterval(progressInterval.value!); + criticalLoad.value = false; assetLoadingProgress.value = 100; isAssetLoaded.value = true; }; @@ -55,30 +65,29 @@ watch([assetLoadingProgress, criticalLoad], ([assetLoadingProgress, criticalLoad // lifecycle onMounted(() => { - isWindowScrollLocked.value = true; - if (!isSiteLoadingDisabled.value) { + isWindowScrollLocked.value = true; + + const heymlzLoadingAnimation = document.querySelector("#heymlz-loading-animation") as HTMLVideoElement; + + if (heymlzLoadingAnimation?.readyState >= HTMLMediaElement.HAVE_ENOUGH_DATA) { + onAssetLoaded(); + } + + progressInterval.value = setInterval(() => { + assetLoadingProgress.value += Math.random() * 10; + }, 250); + + gsap.to("#loading-overlay", { + opacity: 1, + }); } - - const heymlzLoadingAnimation = document.querySelector("#heymlz-loading-animation") as HTMLVideoElement; - - if (heymlzLoadingAnimation?.readyState >= HTMLMediaElement.HAVE_ENOUGH_DATA) { - onAssetLoaded(); - } - - progressInterval.value = setInterval(() => { - assetLoadingProgress.value += Math.random() * 10; - }, 250); - - gsap.to("#loading-overlay", { - opacity: 1, - }); });