From 50bf9061be778b37f7f6869f4c39a4833af31b1d Mon Sep 17 00:00:00 2001
From: Nikita Kiselev <kiselev2008@gmail.com>
Date: Sun, 3 Aug 2025 19:32:23 +0300
Subject: [PATCH] feat(style): change pagination swiper styles

---
 spa/src/components/ProductImageSwiper.vue |  6 +-----
 spa/src/style.css                         | 10 ++++++++++
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/spa/src/components/ProductImageSwiper.vue b/spa/src/components/ProductImageSwiper.vue
index 97bae48..b62a366 100644
--- a/spa/src/components/ProductImageSwiper.vue
+++ b/spa/src/components/ProductImageSwiper.vue
@@ -1,10 +1,6 @@
 <template>
   <div class="aspect-w-4 aspect-h-3">
     <swiper
-        :style="{
-      '--swiper-navigation-color': '#fff',
-      '--swiper-pagination-color': '#fff',
-    }"
         :lazy="true"
         :pagination="pagination"
         :navigation="true"
@@ -80,7 +76,7 @@ export default {
         dynamicBullets: true,
       },
       modules: [Pagination],
-      onTouchMove, // ← вот это добавь
+      onTouchMove,
     };
   },
 };
diff --git a/spa/src/style.css b/spa/src/style.css
index 7e48648..42b4524 100644
--- a/spa/src/style.css
+++ b/spa/src/style.css
@@ -8,6 +8,16 @@ html, body, #app {
     height: 100%;
 }
 
+html {
+    --swiper-pagination-color: var(--color-primary);
+    --swiper-pagination-bullet-inactive-color: var(--color-base-content);
+}
+
+.swiper-pagination-bullets {
+    border-radius: var(--radius-selector);
+    padding: 5px 0;
+}
+
 #app {
     position: relative;
     padding-top: var(--tg-content-safe-area-inset-top);