init git

2024-06-16 00:22:14 +04:30
commit ec84dfd222
322 changed files with 77942 additions and 0 deletions
@@ -0,0 +1,52 @@
+<template>
+    <section v-if="similars.length > 0" class="similars">
+        <h2>{{ $t('productSimilars') }}</h2>
+        <div>
+            <template v-if="device == 'desktop'">
+                <Button v-for="(btn, i) in arrows" :key="i" v-bind="btn" />
+            </template>
+            <Swiper v-bind="swiper.similars">
+                <SwiperSlide v-for="(item, i) in similars" :key="i">
+                    <ProductCard :data="item" type="action" />
+                </SwiperSlide>
+            </Swiper>
+        </div>
+    </section>
+</template>
+
+<script setup>
+const { swiper, arrows } = inject('init')
+const { device } = inject('service')
+const { similars } = inject('data')
+</script>
+
+<style lang="scss">
+.product .similars {
+    @apply w-full flex flex-col items-center overflow-hidden;
+
+    &>h2 {
+        @apply text-[#0B1F11] text-lg lg:text-3xl font-bold font-vazir;
+    }
+
+    &>div {
+        @apply max-w-full w-full flex gap-10 h-max mt-6 lg:my-16 relative;
+
+        .swiper {
+            @apply w-full container h-max py-4 px-6;
+
+            .swiper-wrapper {
+                @apply w-max h-max;
+
+                .swiper-slide {
+                    @apply w-max ml-[0.9rem] last:ml-0;
+                }
+            }
+        }
+
+        &>button {
+            @apply w-10 h-10 self-center absolute text-xl p-0 bg-[#B2B2B2] border-none #{!important};
+            @apply first-of-type:-right-16 last-of-type:-left-16 max-lg:hidden;
+        }
+    }
+}
+</style>