mail page fix design

This commit is contained in:
alma 2025-04-21 20:45:29 +02:00
parent d1da9c4be8
commit d0f6c78c38
2 changed files with 7 additions and 6 deletions

View File

@ -403,7 +403,7 @@ function getReplyBody(email: Email, type: 'reply' | 'reply-all' | 'forward' = 'r
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; unicode-bidi: bidi-override"> <div class="prose max-w-none" dir="ltr" style="direction: ltr; text-align: left;">
<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" dir="ltr">
<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" dir="ltr">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" dir="ltr">Date: ${new Date(email.date).toLocaleString()}</p>
@ -416,7 +416,7 @@ function getReplyBody(email: Email, type: 'reply' | 'reply-all' | 'forward' = 'r
`; `;
} else { } else {
formattedContent = ` formattedContent = `
<div class="prose max-w-none" dir="ltr" style="direction: ltr; text-align: left; unicode-bidi: bidi-override"> <div class="prose max-w-none" dir="ltr" style="direction: ltr; text-align: left;">
<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" dir="ltr">
<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" dir="ltr">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" dir="ltr">${content}</div>

View File

@ -57,8 +57,8 @@ export default function ComposeEmail({
if (composeBodyRef.current) { if (composeBodyRef.current) {
const decodedContent = decodeComposeContent(composeBody); const decodedContent = decodeComposeContent(composeBody);
composeBodyRef.current.innerHTML = decodedContent composeBodyRef.current.innerHTML = decodedContent
.replace(/<div[^>]*>/g, '<div dir="ltr">') .replace(/<div[^>]*>/g, '<div dir="ltr" style="direction: ltr; text-align: left;">')
.replace(/<p[^>]*>/g, '<p dir="ltr">'); .replace(/<p[^>]*>/g, '<p dir="ltr" style="direction: ltr; text-align: left;">');
} }
}, [composeBody]); }, [composeBody]);
@ -74,7 +74,7 @@ export default function ComposeEmail({
.replace(/<\/span>/g, '</span>'); .replace(/<\/span>/g, '</span>');
const encodedContent = encodeComposeContent( const encodedContent = encodeComposeContent(
`<div dir="ltr">${content}</div>` `<div dir="ltr" style="direction: ltr; text-align: left;">${content}</div>`
); );
setComposeBody(encodedContent); setComposeBody(encodedContent);
} }
@ -237,7 +237,8 @@ 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',
direction: 'ltr' direction: 'ltr',
textAlign: 'left'
}} }}
dir="ltr" dir="ltr"
data-gramm="false" data-gramm="false"