From c97e6a6182741ea71e5bc4cdbdf350fbbab20d5e Mon Sep 17 00:00:00 2001
From: ashisgreat22 <dev@ashisgreat.xyz>
Date: Sun, 22 Mar 2026 23:14:48 +0100
Subject: [PATCH] fix(frontend): improve pagination CSS for better centering
 and sizing

- Match .page-current padding to button padding (0 0.75rem)
- Add box-sizing: border-box to buttons
- Add margin/padding reset to pagination forms
- Simplify page-current flex layout

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 internal/views/static/css/kafka.css | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/internal/views/static/css/kafka.css b/internal/views/static/css/kafka.css
index 3d87346..feb6da5 100644
--- a/internal/views/static/css/kafka.css
+++ b/internal/views/static/css/kafka.css
@@ -443,6 +443,8 @@ main {
 .pagination button,
 .pagination form {
   display: inline-flex;
+  margin: 0;
+  padding: 0;
 }
 
 .pagination button {
@@ -457,6 +459,8 @@ main {
   font-family: inherit;
   cursor: pointer;
   transition: background 0.15s, border-color 0.15s;
+  line-height: 1;
+  box-sizing: border-box;
 }
 
 .pagination button:hover {
@@ -466,16 +470,19 @@ main {
 
 .page-current {
   min-width: 40px;
+  width: auto;
   height: 40px;
   padding: 0 0.75rem;
-  border: 1px solid var(--accent) !important;
+  border: 1px solid var(--accent);
   border-radius: var(--radius-sm);
-  background: var(--accent) !important;
-  color: #fff !important;
+  background: var(--accent);
+  color: #fff;
   font-size: 0.9rem;
-  display: flex;
+  font-weight: 500;
+  display: inline-flex;
   align-items: center;
   justify-content: center;
+  box-sizing: border-box;
 }
 
 /* ============================================================