From bc854819299b9366a025f80355122c3581275bb4 Mon Sep 17 00:00:00 2001
From: sebastjanartic <45803536-sebastjanartic@users.noreply.replit.com>
Date: Thu, 28 Aug 2025 20:06:25 +0000
Subject: [PATCH] Improve video modal display for better readability

Update client/src/components/bunny-video-modal.tsx to adjust text styling for video titles and descriptions, improving their presentation within the modal.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2eb1084e-b728-4449-9231-f1665924c8d5
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2eb1084e-b728-4449-9231-f1665924c8d5/r4YOUN9
---
 client/src/components/bunny-video-modal.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/client/src/components/bunny-video-modal.tsx b/client/src/components/bunny-video-modal.tsx
index 1754f1e..7e3b453 100644
--- a/client/src/components/bunny-video-modal.tsx
+++ b/client/src/components/bunny-video-modal.tsx
@@ -148,7 +148,7 @@ export default function BunnyVideoModal({ video, isOpen, onClose, onEdit }: Bunn
       <div className="relative w-full h-full max-w-7xl mx-auto p-4 flex flex-col">
         {/* Header with close button */}
         <div className="flex justify-between items-center mb-4 z-10">
-          <h2 className="text-xl font-bold text-white truncate flex-1 mr-4">
+          <h2 className="text-xl font-bold text-white flex-1 mr-4 leading-tight">
             {video.title}
           </h2>
           <div className="flex gap-2">
@@ -266,7 +266,7 @@ export default function BunnyVideoModal({ video, isOpen, onClose, onEdit }: Bunn
 
               {video.description && (
                 <div className="text-sm text-gray-300">
-                  <p className="leading-relaxed" data-testid="text-video-description">
+                  <p className="leading-relaxed whitespace-pre-wrap break-words" data-testid="text-video-description">
                     {video.description}
                   </p>
                 </div>