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

Update video player colors to match new branding guidelines

Browse Source 
Update the color scheme of the video player component, specifically modifying class names in `vast-player.tsx` to use `bg-rose-600`, `bg-rose-500`, and `hover:bg-rose-500/30` for various interactive elements and progress bars.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 946a0075-7e32-454b-b348-9e7f576d7f45
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/60d372ff-2c10-46c7-b01b-10c3435136b0/946a0075-7e32-454b-b348-9e7f576d7f45/jh6R7y2
This commit is contained in:
sebastjanartic 2025-09-04 13:24:24 +00:00
parent 9f085439bf
commit 894d21c311
1 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
client/src/components/vast-player.tsx
View File

@ -315,7 +315,7 @@ export default function VASTPlayer({ video, onClose, vastTagUrl, enableAds = tru
{canSkipAd ? ( {canSkipAd ? (
<Button <Button
onClick={skipAd} onClick={skipAd}
className="bg-gray-800 hover:bg-gray-700 text-white px-4 py-2 rounded-full text-sm" className="bg-rose-600 hover:bg-rose-700 text-white px-4 py-2 rounded-full text-sm"
data-testid="button-skip-ad" data-testid="button-skip-ad"
> >
<SkipForward className="w-4 h-4 mr-2" /> <SkipForward className="w-4 h-4 mr-2" />
@ -331,7 +331,7 @@ export default function VASTPlayer({ video, onClose, vastTagUrl, enableAds = tru
{/* Ad Progress */} {/* Ad Progress */}
<div className="mt-2 bg-gray-800 rounded-full h-1"> <div className="mt-2 bg-gray-800 rounded-full h-1">
<div <div
className="bg-yellow-600 h-full rounded-full transition-all duration-100" className="bg-rose-500 h-full rounded-full transition-all duration-100"
style={{ width: `${adDuration ? (adCurrentTime / adDuration) * 100 : 0}%` }} style={{ width: `${adDuration ? (adCurrentTime / adDuration) * 100 : 0}%` }}
/> />
</div> </div>
@ -357,7 +357,7 @@ export default function VASTPlayer({ video, onClose, vastTagUrl, enableAds = tru
setIsPlaying(true); setIsPlaying(true);
} }
}} }}
className="text-white hover:bg-white/20" className="text-white hover:bg-rose-500/30"
> >
{(isAdPlaying ? isAdPlaying : isPlaying) ? {(isAdPlaying ? isAdPlaying : isPlaying) ?
<Pause className="w-5 h-5" /> : <Pause className="w-5 h-5" /> :
@ -370,7 +370,7 @@ export default function VASTPlayer({ video, onClose, vastTagUrl, enableAds = tru
variant="ghost" variant="ghost"
size="icon" size="icon"
onClick={toggleMute} onClick={toggleMute}
className="text-white hover:bg-white/20" className="text-white hover:bg-rose-500/30"
> >
{isMuted ? <VolumeX className="w-5 h-5" /> : <Volume2 className="w-5 h-5" />} {isMuted ? <VolumeX className="w-5 h-5" /> : <Volume2 className="w-5 h-5" />}
</Button> </Button>
@ -395,7 +395,7 @@ export default function VASTPlayer({ video, onClose, vastTagUrl, enableAds = tru
container.requestFullscreen(); container.requestFullscreen();
} }
}} }}
className="text-white hover:bg-white/20" className="text-white hover:bg-rose-500/30"
> >
<Maximize className="w-5 h-5" /> <Maximize className="w-5 h-5" />
</Button> </Button>
@ -419,7 +419,7 @@ export default function VASTPlayer({ video, onClose, vastTagUrl, enableAds = tru
}} }}
> >
<div <div
className="bg-bunny-blue h-full rounded-full transition-all duration-100" className="bg-rose-500 h-full rounded-full transition-all duration-100"
style={{ width: `${duration ? (currentTime / duration) * 100 : 0}%` }} style={{ width: `${duration ? (currentTime / duration) * 100 : 0}%` }}
/> />
</div> </div>