diff --git a/backend/product/serializers.py b/backend/product/serializers.py index af7cf93..4d03b07 100644 --- a/backend/product/serializers.py +++ b/backend/product/serializers.py @@ -8,9 +8,19 @@ from django.contrib.auth.models import AnonymousUser class DetailSerializer(serializers.ModelSerializer): + texts = serializers.SerializerMethodField() class Meta: model = DetailModel - exclude = ['detail_model'] + exclude = ['detail_model', 'detail_text1', 'detail_text2', 'detail_text3', 'detail_text4'] + def get_texts(self, obj): + return [ + text for text in [ + obj.detail_text1, + obj.detail_text2, + obj.detail_text3, + obj.detail_text4, + ] if text + ] class ProductDetailSerializer(serializers.ModelSerializer): details = DetailSerializer(many=True, read_only=True) diff --git a/frontend/assets/css/tailwind.css b/frontend/assets/css/tailwind.css index f071dc5..5696404 100644 --- a/frontend/assets/css/tailwind.css +++ b/frontend/assets/css/tailwind.css @@ -131,8 +131,6 @@ --breakpoint-3xl: 1700px; /* ANIMATIONS */ - --animate-marquee: marquee 20s linear infinite; - --animate-marquee-reverse: marquee 20s linear infinite reverse; --animate-fade-in: fadeIn 350ms ease-in-out; --animate-slide-down: slideDown 300ms ease-out; @@ -149,12 +147,6 @@ --animate-toast-in: toastSlideIn 600ms cubic-bezier(0.16, 1, 0.3, 1); --animate-toast-out: toastSlideOut 200ms ease-out; - @keyframes marquee { - to { - transform: translateX(50%); - } - } - @keyframes fadeIn { from { opacity: 0; diff --git a/frontend/components/global/Brands.vue b/frontend/components/global/Brands.vue index 370b2d5..d570827 100644 --- a/frontend/components/global/Brands.vue +++ b/frontend/components/global/Brands.vue @@ -9,6 +9,15 @@ type Props = { const props = defineProps(); const {} = toRefs(props); + +const brands = ref([ + "/img/brands/brand-1.png", + "/img/brands/brand-2.png", + "/img/brands/brand-3.png", + "/img/brands/brand-4.png", + "/img/brands/brand-5.png", + "/img/brands/brand-6.png", +]); + diff --git a/frontend/components/global/product-detail/ProductsSlider.vue b/frontend/components/global/product-detail/ProductsSlider.vue index c8af456..d386ab7 100644 --- a/frontend/components/global/product-detail/ProductsSlider.vue +++ b/frontend/components/global/product-detail/ProductsSlider.vue @@ -3,12 +3,12 @@ import { Swiper, SwiperSlide } from "swiper/vue"; import type { SwiperClass } from "swiper/react"; -import useHomeData from "~/composables/api/home/useHomeData"; // types type Props = { title: string; + products: ProductListItem[]; }; // props @@ -17,14 +17,8 @@ defineProps(); // state -const { data: homeData, suspense } = useHomeData(); - const swiper_instance = ref(null); -// queries - -await suspense(); - // methods const onSwiper = (swiper: SwiperClass) => { @@ -100,7 +94,7 @@ const onSwiper = (swiper: SwiperClass) => { }" > { const changeSlide = (id: number) => { emit("update:selectedSlide", id); }; - diff --git a/frontend/components/home/Categories.vue b/frontend/components/home/Categories.vue index 24d5c33..e1bb9e4 100644 --- a/frontend/components/home/Categories.vue +++ b/frontend/components/home/Categories.vue @@ -23,16 +23,16 @@ const onSwiper = (swiper: SwiperClass) => { class="flex flex-col justify-center gap-4 bg-black sm:min-h-[110svh] relative overflow-hidden shrink-0 py-24 lg:py-32" >
- دسته بندی ها + دسته بندی ها
{
{ />
-

+ {{ slide.title }} -

+
{{ slide.description }} - + + + @@ -270,7 +286,9 @@ onUnmounted(() => { @click="swiper_instance?.slidePrev()" class="relative" > -
+
{ @click="swiper_instance?.slideNext()" class="relative" > -
+
("none"); const draggableEl = ref(null); const previewContainerEl = ref(null); -const heymlzElement = useTemplateRef("heymlzElement"); -const heymlzElementIsVisible = useElementVisibility(heymlzElement, { - rootMargin: "0px 0px -40% 0px", -}); +// const heymlzElement = useTemplateRef("heymlzElement"); +// const heymlzElementIsVisible = useElementVisibility(heymlzElement, { +// rootMargin: "0px 0px -40% 0px", +// }); -const showHeymlzAnimation = ref(false); +// const showHeymlzAnimation = ref(false); const { x: dragAxisX } = useDraggable(draggableEl, { initialValue: { x: 0, y: 0 }, @@ -28,22 +28,22 @@ const { x: dragAxisX } = useDraggable(draggableEl, { // watch -watch( - heymlzElementIsVisible, - (newValue) => { - if (newValue) { - setTimeout(() => { - showHeymlzAnimation.value = true; - setTimeout(() => { - showHeymlzAnimation.value = false; - }, 3200); - }, 400); - } - }, - { - once: true, - } -); +// watch( +// heymlzElementIsVisible, +// (newValue) => { +// if (newValue) { +// setTimeout(() => { +// showHeymlzAnimation.value = true; +// setTimeout(() => { +// showHeymlzAnimation.value = false; +// }, 3200); +// }, 400); +// } +// }, +// { +// once: true, +// } +// ); watch( () => clipPathPercent.value, @@ -64,7 +64,7 @@ watch( const clientRect = previewContainerEl.value?.getBoundingClientRect()!; const percent = clientRect.width / 100; const clipPercent = (newValue + draggableEl.value!.clientWidth / 2 - clientRect.x - 8) / percent; - if (clipPercent >= 5 && clipPercent <= 95) { + if (clipPercent >= 1 && clipPercent <= 99) { clipPathPercent.value = clipPercent; } } @@ -72,7 +72,7 @@ watch(