init git

2024-06-16 00:22:14 +04:30
commit ec84dfd222
322 changed files with 77942 additions and 0 deletions
@@ -0,0 +1,51 @@
+<template>
+    <section class="top-slider">
+        <template v-for="(btn, i) in btns.arrows" :key="i">
+            <Button v-if="device == 'desktop'" v-bind="btn" />
+        </template>
+        <Swiper v-bind="swipers.topSlider">
+            <SwiperSlide v-for="{ link, images, title, id } in sliders" :key="id">
+                <router-link :to="link">
+                    <img :title="title" :src="images[device]" />
+                </router-link>
+            </SwiperSlide>
+        </Swiper>
+    </section>
+</template>
+
+<script setup>
+const { swipers, btns } = inject('init')
+const { device } = inject('service')
+const { sliders } = inject('data')
+</script>
+
+<style lang="scss">
+.top-slider {
+    @apply w-full h-max flex z-0;
+
+    .swiper {
+        @apply w-full h-max;
+
+        .swiper-wrapper {
+            @apply z-0 h-max bg-gray-50;
+
+            .swiper-slide {
+                @apply w-screen h-full;
+
+                a {
+                    img {
+                        @apply w-full object-cover h-full;
+                    }
+                }
+            }
+        }
+    }
+
+    &>button {
+        @apply self-center absolute p-0 bg-white/40 border-none max-lg:hidden z-10 #{!important};
+        @apply lg:w-8 lg:h-8 lg:text-base lg:first-of-type:right-8 lg:last-of-type:left-9 #{!important};
+        @apply xl:w-9 xl:h-9 xl:text-lg xl:first-of-type:right-12 xl:last-of-type:left-12 #{!important};
+        @apply 2xl:w-10 2xl:h-10 2xl:text-xl 2xl:first-of-type:right-16 2xl:last-of-type:left-16 #{!important};
+    }
+}
+</style>