coresync/ads-marketing
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix paginator

Browse Source
This commit is contained in:
romantarkin 2025-08-02 16:57:27 +05:00
parent 5c0b8f02bd
commit a637020af6
1 changed files with 28 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
frontend/src/styles/Paginator.module.css
View File

@ -9,7 +9,7 @@
.btn { .btn {
border: none; border: none;
background: #f3f4f6; background: var(--hover-background);
color: #6366f1; color: #6366f1;
border-radius: 50%; border-radius: 50%;
width: 36px; width: 36px;
@ -24,9 +24,13 @@
justify-content: center; justify-content: center;
} }
.btn:hover {
background: var(--border-color);
}
.page { .page {
border: none; border: none;
background: #f3f4f6; background: var(--hover-background);
color: #6366f1; color: #6366f1;
border-radius: 50%; border-radius: 50%;
width: 36px; width: 36px;
@ -41,11 +45,24 @@
justify-content: center; justify-content: center;
} }
.page:hover {
background: var(--border-color);
}
.pageActive { .pageActive {
background: linear-gradient(90deg, #6366f1 0%, #06b6d4 100%); background: #6366f1;
color: #fff; color: #fff;
cursor: default; 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; gap: 4px;
} }
.btn, .page { .btn, .page, .pageActive {
width: 32px; width: 32px;
height: 32px; height: 32px;
font-size: 16px; font-size: 16px;
} }
.page { .page, .pageActive {
font-size: 14px; font-size: 14px;
} }
} }
@ -74,13 +91,13 @@
justify-content: center; justify-content: center;
} }
.btn, .page { .btn, .page, .pageActive {
width: 40px; width: 40px;
height: 40px; height: 40px;
font-size: 18px; font-size: 18px;
} }
.page { .page, .pageActive {
font-size: 16px; font-size: 16px;
} }
} }
@ -91,20 +108,20 @@
gap: 2px; gap: 2px;
} }
.btn, .page { .btn, .page, .pageActive {
width: 36px; width: 36px;
height: 36px; height: 36px;
font-size: 16px; font-size: 16px;
} }
.page { .page, .pageActive {
font-size: 14px; font-size: 14px;
} }
} }
/* Улучшенная поддержка touch устройств */ /* Улучшенная поддержка touch устройств */
@media (hover: none) and (pointer: coarse) { @media (hover: none) and (pointer: coarse) {
.btn, .page { .btn, .page, .pageActive {
min-width: 44px; min-width: 44px;
min-height: 44px; min-height: 44px;
} }