sebastjan/videofolxtv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve navigation buttons for video playback

Browse Source 
Update the styling and size of the previous and next video navigation buttons on the VideoPage component, making them more visually appealing and user-friendly.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 344ec1e0-1186-4058-bbff-2e9619a7b1e0
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/344ec1e0-1186-4058-bbff-2e9619a7b1e0/zJYuV6w
This commit is contained in:
sebastjanartic 2025-08-30 23:11:15 +00:00
parent bad85bbe55
commit 4a21b2bf6d
1 changed files with 4 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
client/src/pages/VideoPage.tsx
View File

@ -420,12 +420,11 @@ export default function VideoPage() {
e.stopPropagation(); e.stopPropagation();
navigateToVideo('prev'); navigateToVideo('prev');
}} }}
className="absolute left-2 top-1/2 transform -translate-y-1/2 bg-black/90 hover:bg-black text-white border-none p-4 rounded-full shadow-xl flex items-center justify-center" className="absolute left-1 top-1/2 transform -translate-y-1/2 bg-black/70 hover:bg-black/90 text-white border-none p-3 rounded-full z-20 shadow-lg hidden md:flex items-center justify-center"
style={{ zIndex: 9999, pointerEvents: 'auto', display: 'flex' }}
size="sm" size="sm"
data-testid="button-prev-video" data-testid="button-prev-video"
> >
<ChevronLeft className="w-6 h-6" /> <ChevronLeft className="w-5 h-5" />
</Button> </Button>
<Button <Button
onClick={(e) => { onClick={(e) => {
@ -433,12 +432,11 @@ export default function VideoPage() {
e.stopPropagation(); e.stopPropagation();
navigateToVideo('next'); navigateToVideo('next');
}} }}
className="absolute right-2 top-1/2 transform -translate-y-1/2 bg-black/90 hover:bg-black text-white border-none p-4 rounded-full shadow-xl flex items-center justify-center" className="absolute right-1 top-1/2 transform -translate-y-1/2 bg-black/70 hover:bg-black/90 text-white border-none p-3 rounded-full z-20 shadow-lg hidden md:flex items-center justify-center"
style={{ zIndex: 9999, pointerEvents: 'auto', display: 'flex' }}
size="sm" size="sm"
data-testid="button-next-video" data-testid="button-next-video"
> >
<ChevronRight className="w-6 h-6" /> <ChevronRight className="w-5 h-5" />
</Button> </Button>
</> </>
)} )}