From a637020af6c8fb02489c07355e5dda0efe468766 Mon Sep 17 00:00:00 2001
From: romantarkin <romtucks@yandex.ru>
Date: Sat, 2 Aug 2025 16:57:27 +0500
Subject: [PATCH] fix paginator

---
 frontend/src/styles/Paginator.module.css | 39 +++++++++++++++++-------
 1 file changed, 28 insertions(+), 11 deletions(-)

diff --git a/frontend/src/styles/Paginator.module.css b/frontend/src/styles/Paginator.module.css
index 813653c..7122ac9 100644
--- a/frontend/src/styles/Paginator.module.css
+++ b/frontend/src/styles/Paginator.module.css
@@ -9,7 +9,7 @@
 
 .btn {
   border: none;
-  background: #f3f4f6;
+  background: var(--hover-background);
   color: #6366f1;
   border-radius: 50%;
   width: 36px;
@@ -24,9 +24,13 @@
   justify-content: center;
 }
 
+.btn:hover {
+  background: var(--border-color);
+}
+
 .page {
   border: none;
-  background: #f3f4f6;
+  background: var(--hover-background);
   color: #6366f1;
   border-radius: 50%;
   width: 36px;
@@ -41,11 +45,24 @@
   justify-content: center;
 }
 
+.page:hover {
+  background: var(--border-color);
+}
+
 .pageActive {
-  background: linear-gradient(90deg, #6366f1 0%, #06b6d4 100%);
+  background: #6366f1;
   color: #fff;
   cursor: default;
-  box-shadow: 0 2px 8px 0 rgba(99,102,241,0.10);
+  border-radius: 50%;
+  width: 36px;
+  height: 36px;
+  font-size: 16px;
+  font-weight: 600;
+  transition: background 0.18s, color 0.18s;
+  box-shadow: 0 1px 4px 0 rgba(99,102,241,0.06);
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
 /* Адаптивные стили для планшетов */
@@ -55,13 +72,13 @@
     gap: 4px;
   }
   
-  .btn, .page {
+  .btn, .page, .pageActive {
     width: 32px;
     height: 32px;
     font-size: 16px;
   }
   
-  .page {
+  .page, .pageActive {
     font-size: 14px;
   }
 }
@@ -74,13 +91,13 @@
     justify-content: center;
   }
   
-  .btn, .page {
+  .btn, .page, .pageActive {
     width: 40px;
     height: 40px;
     font-size: 18px;
   }
   
-  .page {
+  .page, .pageActive {
     font-size: 16px;
   }
 }
@@ -91,20 +108,20 @@
     gap: 2px;
   }
   
-  .btn, .page {
+  .btn, .page, .pageActive {
     width: 36px;
     height: 36px;
     font-size: 16px;
   }
   
-  .page {
+  .page, .pageActive {
     font-size: 14px;
   }
 }
 
 /* Улучшенная поддержка touch устройств */
 @media (hover: none) and (pointer: coarse) {
-  .btn, .page {
+  .btn, .page, .pageActive {
     min-width: 44px;
     min-height: 44px;
   }