heymlz/hossein-por-shop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update arrow buttons and swiper responsive

Browse Source
This commit is contained in:
marzban-dev
2025-05-22 01:07:05 +03:30
parent 59956d3232
commit e4e7c8adfb
1 changed files with 12 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/components/home/Categories.vue
+12 -2
View File
@@ -60,7 +60,17 @@ const onSlideChange = (swiper: SwiperClass) => {
slideShadows: true,
}"
:breakpoints="{
320: {
coverflowEffect: {
stretch: -50,
},
slidesPerView: 1.75,
centeredSlides: true,
},
640: {
coverflowEffect: {
stretch: -100,
},
centeredSlides: true,
slidesPerView: 2.65,
},
@@ -95,7 +105,7 @@ const onSlideChange = (swiper: SwiperClass) => {
:style="{
right: `calc(50% - ${slideWidth / 2}px - 20px)`,
}"
class="max-xs:hidden absolute z-20 shadow-lg cursor-pointer shadow-black/25 bottom-[50%] translate-y-1/2 bg-white rounded-full size-10 xs:size-11.5 flex justify-center items-center"
class="absolute z-20 shadow-lg cursor-pointer shadow-black/25 bottom-[50%] translate-y-1/2 bg-white rounded-full size-10 xs:size-11.5 flex justify-center items-center"
>
<Icon
name="ci:arrow-right"
@@ -109,7 +119,7 @@ const onSlideChange = (swiper: SwiperClass) => {
:style="{
left: `calc(50% - ${slideWidth / 2}px - 20px)`,
}"
class="max-xs:hidden absolute z-20 shadow-lg cursor-pointer shadow-black/25 bottom-[50%] translate-y-1/2 bg-white rounded-full size-10 xs:size-11.5 flex justify-center items-center"
class="absolute z-20 shadow-lg cursor-pointer shadow-black/25 bottom-[50%] translate-y-1/2 bg-white rounded-full size-10 xs:size-11.5 flex justify-center items-center"
>
<Icon
name="ci:arrow-left"