Improve pagination display for better readability on smaller screens
Update pagination components to include overflow scrolling and ensure proper flex behavior for page numbers. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/DyHCx4q
This commit is contained in:
parent
3d07c4d2c8
commit
156da5dec8
@ -258,7 +258,7 @@ export default function FolxStadlPage() {
|
||||
|
||||
{/* Bottom Pagination */}
|
||||
{totalPages > 1 && (
|
||||
<div className="mt-8 flex justify-center gap-2">
|
||||
<div className="mt-8 flex justify-center gap-2 px-4 overflow-x-auto">
|
||||
<Button
|
||||
variant="outline"
|
||||
onClick={() => setCurrentPage(Math.max(1, currentPage - 1))}
|
||||
@ -269,7 +269,7 @@ export default function FolxStadlPage() {
|
||||
Vorherige
|
||||
</Button>
|
||||
|
||||
<div className="flex gap-1">
|
||||
<div className="flex gap-1 min-w-0 flex-shrink-0">
|
||||
{Array.from({ length: Math.min(totalPages, 5) }, (_, i) => {
|
||||
let pageNum;
|
||||
if (totalPages <= 5) {
|
||||
|
||||
@ -260,7 +260,7 @@ export default function GeschichteLiedPage() {
|
||||
|
||||
{/* Bottom Pagination */}
|
||||
{totalPages > 1 && (
|
||||
<div className="mt-8 flex justify-center gap-2">
|
||||
<div className="mt-8 flex justify-center gap-2 px-4 overflow-x-auto">
|
||||
<Button
|
||||
variant="outline"
|
||||
onClick={() => setCurrentPage(Math.max(1, currentPage - 1))}
|
||||
@ -271,7 +271,7 @@ export default function GeschichteLiedPage() {
|
||||
Vorherige
|
||||
</Button>
|
||||
|
||||
<div className="flex gap-1">
|
||||
<div className="flex gap-1 min-w-0 flex-shrink-0">
|
||||
{Array.from({ length: Math.min(totalPages, 5) }, (_, i) => {
|
||||
let pageNum;
|
||||
if (totalPages <= 5) {
|
||||
|
||||
@ -260,7 +260,7 @@ export default function GipfelstammtischPage() {
|
||||
|
||||
{/* Bottom Pagination */}
|
||||
{totalPages > 1 && (
|
||||
<div className="mt-8 flex justify-center gap-2">
|
||||
<div className="mt-8 flex justify-center gap-2 px-4 overflow-x-auto">
|
||||
<Button
|
||||
variant="outline"
|
||||
onClick={() => setCurrentPage(Math.max(1, currentPage - 1))}
|
||||
@ -271,7 +271,7 @@ export default function GipfelstammtischPage() {
|
||||
Vorherige
|
||||
</Button>
|
||||
|
||||
<div className="flex gap-1">
|
||||
<div className="flex gap-1 min-w-0 flex-shrink-0">
|
||||
{Array.from({ length: Math.min(totalPages, 5) }, (_, i) => {
|
||||
let pageNum;
|
||||
if (totalPages <= 5) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user