Adjust slide bar length to match horizontal slide length

Modify the `MohamedSalahSlides` component in `client/src/pages/Report.tsx` to ensure the progress bar's width (`w-full max-w-[1000px]`) aligns with the slide's horizontal dimension, improving visual consistency.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 9a264234-c5d7-4dcc-adf3-a954b149b30d
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/3df548ff-50ae-432f-9be4-25d34eccc983/9a264234-c5d7-4dcc-adf3-a954b149b30d/uCJPlBt
This commit is contained in:
kimjaehyeon0101
2025-10-15 05:37:17 +00:00
parent 1fedd40899
commit 7326e299e9

View File

@ -118,9 +118,9 @@ function MohamedSalahSlides() {
</Document>
</div>
<div className="space-y-4">
<div className="space-y-4 flex flex-col items-center">
{/* Progress Bar */}
<div className="relative px-2" data-testid="slide-progress-container">
<div className="relative w-full max-w-[1000px]" data-testid="slide-progress-container">
<div
className="relative py-2"
onClick={handleSliderClick}
@ -141,7 +141,7 @@ function MohamedSalahSlides() {
/>
{/* Slide markers */}
<div className="absolute top-0 left-0 right-0 h-full pointer-events-none">
<div className="relative h-full px-2">
<div className="relative h-full">
{numPages > 0 && Array.from({ length: numPages }).map((_, i) => (
<div
key={i}
@ -173,7 +173,7 @@ function MohamedSalahSlides() {
</div>
{/* Control buttons */}
<div className="flex items-center justify-between">
<div className="flex items-center justify-between w-full max-w-[1000px]">
<Button
variant="outline"
onClick={() => setCurrentSlide(Math.max(1, currentSlide - 1))}