mail page fix design

This commit is contained in:
alma 2025-04-21 20:50:45 +02:00
parent 17c33d7fc0
commit adb1117f56
2 changed files with 18 additions and 21 deletions

View File

@ -399,27 +399,27 @@ function getReplyBody(email: Email, type: 'reply' | 'reply-all' | 'forward' = 'r
// Clean and sanitize HTML content // Clean and sanitize HTML content
content = cleanHtml(content); content = cleanHtml(content);
// Format the reply/forward content with proper direction // Format the reply/forward content
let formattedContent = ''; let formattedContent = '';
if (type === 'forward') { if (type === 'forward') {
formattedContent = ` formattedContent = `
<div class="prose max-w-none" dir="ltr" style="direction: ltr; text-align: left;"> <div class="prose max-w-none" dir="ltr">
<div class="border-l-4 border-gray-300 pl-4 my-4" dir="ltr"> <div class="border-l-4 border-gray-300 pl-4 my-4">
<p class="text-sm text-gray-600 mb-2" dir="ltr">Forwarded message from ${email.from}</p> <p class="text-sm text-gray-600 mb-2">Forwarded message from ${email.from}</p>
<p class="text-sm text-gray-600 mb-2" dir="ltr">Date: ${new Date(email.date).toLocaleString()}</p> <p class="text-sm text-gray-600 mb-2">Date: ${new Date(email.date).toLocaleString()}</p>
<p class="text-sm text-gray-600 mb-2" dir="ltr">Subject: ${email.subject}</p> <p class="text-sm text-gray-600 mb-2">Subject: ${email.subject}</p>
<p class="text-sm text-gray-600 mb-2" dir="ltr">To: ${email.to}</p> <p class="text-sm text-gray-600 mb-2">To: ${email.to}</p>
${email.cc ? `<p class="text-sm text-gray-600 mb-2" dir="ltr">Cc: ${email.cc}</p>` : ''} ${email.cc ? `<p class="text-sm text-gray-600 mb-2">Cc: ${email.cc}</p>` : ''}
<div class="mt-4 prose-sm" dir="ltr">${content}</div> <div class="mt-4 prose-sm">${content}</div>
</div> </div>
</div> </div>
`; `;
} else { } else {
formattedContent = ` formattedContent = `
<div class="prose max-w-none" dir="ltr" style="direction: ltr; text-align: left;"> <div class="prose max-w-none" dir="ltr">
<div class="border-l-4 border-gray-300 pl-4 my-4" dir="ltr"> <div class="border-l-4 border-gray-300 pl-4 my-4">
<p class="text-sm text-gray-600 mb-2" dir="ltr">On ${new Date(email.date).toLocaleString()}, ${email.from} wrote:</p> <p class="text-sm text-gray-600 mb-2">On ${new Date(email.date).toLocaleString()}, ${email.from} wrote:</p>
<div class="mt-4 prose-sm" dir="ltr">${content}</div> <div class="mt-4 prose-sm">${content}</div>
</div> </div>
</div> </div>
`; `;

View File

@ -62,8 +62,7 @@ export default function ComposeEmail({
const handleInput = (e: React.FormEvent<HTMLDivElement>) => { const handleInput = (e: React.FormEvent<HTMLDivElement>) => {
if (composeBodyRef.current) { if (composeBodyRef.current) {
const content = composeBodyRef.current.innerHTML; const encodedContent = encodeComposeContent(composeBodyRef.current.innerHTML);
const encodedContent = encodeComposeContent(content);
setComposeBody(encodedContent); setComposeBody(encodedContent);
} }
}; };
@ -225,13 +224,11 @@ export default function ComposeEmail({
className="w-full h-full mt-1 bg-white border border-gray-300 rounded-md p-2 text-gray-900 overflow-y-auto" className="w-full h-full mt-1 bg-white border border-gray-300 rounded-md p-2 text-gray-900 overflow-y-auto"
style={{ style={{
minHeight: '200px', minHeight: '200px',
unicodeBidi: 'plaintext', direction: 'ltr',
textAlign: 'start' textAlign: 'left',
unicodeBidi: 'bidi-override'
}} }}
dir="auto" dir="ltr"
data-gramm="false"
data-gramm_editor="false"
data-enable-grammarly="false"
/> />
</div> </div>
</div> </div>