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

Improve video modal layout and styling for better presentation

Browse Source 
Adjusted flex alignment for video title and share button, and updated button styling for share functionality in the video modal component.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 074b0e4c-6171-43bd-aa98-f9e04623ca14
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/074b0e4c-6171-43bd-aa98-f9e04623ca14/Sy6XHzr
This commit is contained in:
sebastjanartic 2025-08-30 16:38:17 +00:00
parent ae6e5b7bc0
commit 465d4c1923
1 changed files with 5 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
client/src/components/bunny-video-modal.tsx
View File

@ -249,23 +249,21 @@ export default function BunnyVideoModal({ video, isOpen, onClose, onEdit, videos
{/* Video info always below video */} {/* Video info always below video */}
<div className="w-full max-w-lg ml-8"> <div className="w-full max-w-lg ml-8">
<div className="p-4 bg-gray-800 rounded-lg text-white relative"> <div className="p-4 bg-gray-800 rounded-lg text-white relative">
<div className="flex justify-between items-start mb-3"> <div className="flex justify-between items-center mb-3">
<h3 className="font-bold text-xl whitespace-normal break-words flex-1 pr-4" data-testid="text-video-title"> <h3 className="font-bold text-xl whitespace-normal break-words flex-1 pr-4" data-testid="text-video-title">
{video.title} {video.title}
</h3> </h3>
{/* Share button next to title */} {/* Share button next to title */}
<div className="relative"> <div className="relative">
<Button <button
variant="outline"
size="sm"
onClick={() => setShowShareMenu(!showShareMenu)} onClick={() => setShowShareMenu(!showShareMenu)}
className="text-white border-white/20 hover:bg-white/10" className="flex items-center gap-1 text-gray-300 hover:text-white text-sm transition-colors"
data-testid="button-share-video" data-testid="button-share-video"
> >
<Share2 className="w-4 h-4 mr-2" /> <Share2 className="w-4 h-4" />
Teilen Teilen
</Button> </button>
{showShareMenu && ( {showShareMenu && (
<div <div