From bcb0bd96881a7c6d28263e337d6039e9d582b45a Mon Sep 17 00:00:00 2001
From: lowcarbdev <lowcarbdev@users.noreply.github.com>
Date: Sun, 1 Mar 2026 23:49:41 -0700
Subject: [PATCH] wider audio control (better timeline seeking)

---
 frontend/src/components/LazyMedia.jsx     | 1 +
 frontend/src/components/MessageThread.jsx | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/LazyMedia.jsx b/frontend/src/components/LazyMedia.jsx
index 29db039..06a440e 100644
--- a/frontend/src/components/LazyMedia.jsx
+++ b/frontend/src/components/LazyMedia.jsx
@@ -299,6 +299,7 @@ function LazyMedia({ messageId, mediaType, className, alt = "MMS attachment" })
                 controls
                 src={src}
                 className="audio-player"
+                style={{ width: '100%' }}
               />
             </div>
           )}
diff --git a/frontend/src/components/MessageThread.jsx b/frontend/src/components/MessageThread.jsx
index 396f4d3..262f907 100644
--- a/frontend/src/components/MessageThread.jsx
+++ b/frontend/src/components/MessageThread.jsx
@@ -581,7 +581,7 @@ function MessageThread({ conversation, startDate, endDate }) {
                   key={message.id}
                   className={`d-flex ${isSent ? 'justify-content-end' : 'justify-content-start'}`}
                 >
-                  <div style={{ maxWidth: '70%' }}>
+                  <div style={message.media_type?.startsWith('audio/') ? { width: '90%' } : { maxWidth: '70%' }}>
                     {/* Sender label for received messages in group conversations */}
                     {showSenderLabel && (
                       <div className="small text-muted mb-1 ms-2" style={{ fontSize: '0.7rem' }}>