Ensure page indicator texts are centered

Maybe fixes #9976

app/src/main/java/eu/kanade/presentation/reader/PageIndicatorText.kt

@@ -4,11 +4,14 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.drawscope.Stroke
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.sp
+import eu.kanade.presentation.theme.TachiyomiTheme
+import tachiyomi.presentation.core.util.ThemePreviews
 
 @Composable
 fun PageIndicatorText(
@@ -19,24 +22,35 @@ fun PageIndicatorText(
 
     val text = "$currentPage / $totalPages"
 
-    Box {
+    val style = TextStyle(
-        Text(
-            text = text,
-            color = Color(45, 45, 45),
-            fontSize = MaterialTheme.typography.bodySmall.fontSize,
-            fontWeight = FontWeight.Bold,
-            letterSpacing = 1.sp,
-            style = TextStyle.Default.copy(
-                drawStyle = Stroke(width = 4f),
-            ),
-        )
-
-        Text(
-            text = text,
         color = Color(235, 235, 235),
         fontSize = MaterialTheme.typography.bodySmall.fontSize,
         fontWeight = FontWeight.Bold,
         letterSpacing = 1.sp,
     )
+    val strokeStyle = style.copy(
+        color = Color(45, 45, 45),
+        drawStyle = Stroke(width = 4f),
+    )
+
+    Box(
+        contentAlignment = Alignment.Center,
+    ) {
+        Text(
+            text = text,
+            style = strokeStyle,
+        )
+        Text(
+            text = text,
+            style = style,
+        )
+    }
+}
+
+@ThemePreviews
+@Composable
+private fun PageIndicatorTextPreview() {
+    TachiyomiTheme {
+        PageIndicatorText(currentPage = 10, totalPages = 69)
     }
 }