Neah version mail design fix 13

This commit is contained in:
alma 2025-04-16 19:54:41 +02:00
parent c6baadd046
commit 376c09bda1

View File

@ -880,9 +880,9 @@ export default function MailPage() {
{selectedEmail ? (
<>
{/* Email actions header */}
<div className="flex-none p-4 border-b border-gray-100">
<div className="flex items-center justify-between h-10">
<div className="flex items-center gap-2 min-w-0">
<div className="flex-none px-4 py-3 border-b border-gray-100">
<div className="flex items-center gap-4">
<div className="flex items-center gap-2 min-w-0 flex-1">
<Button
variant="ghost"
size="icon"
@ -891,59 +891,63 @@ export default function MailPage() {
>
<ChevronLeft className="h-5 w-5" />
</Button>
<h2 className="text-xl font-semibold text-gray-900 truncate">
{selectedEmail.subject}
</h2>
<div className="min-w-0 flex-1">
<h2 className="text-lg font-semibold text-gray-900 truncate">
{selectedEmail.subject}
</h2>
</div>
</div>
<div className="flex items-center gap-1 flex-shrink-0">
<Button
variant="ghost"
size="icon"
className="text-gray-400 hover:text-gray-900 h-9 w-9"
onClick={() => handleReply('reply')}
>
<Reply className="h-5 w-5" />
</Button>
<Button
variant="ghost"
size="icon"
className="text-gray-400 hover:text-gray-900 h-9 w-9"
onClick={() => handleReply('replyAll')}
>
<ReplyAll className="h-5 w-5" />
</Button>
<Button
variant="ghost"
size="icon"
className="text-gray-400 hover:text-gray-900 h-9 w-9"
onClick={() => handleReply('forward')}
>
<Forward className="h-5 w-5" />
</Button>
<Button
variant="ghost"
size="icon"
className="text-gray-400 hover:text-gray-900 h-9 w-9"
onClick={(e) => toggleStarred(selectedEmail.id, e)}
>
<Star className={`h-5 w-5 ${selectedEmail.starred ? 'fill-yellow-400 text-yellow-400' : ''}`} />
</Button>
<Button
variant="ghost"
size="icon"
className="text-gray-400 hover:text-gray-900 h-9 w-9"
onClick={() => {/* Add to folder logic */}}
>
<FolderOpen className="h-5 w-5" />
</Button>
<Button
variant="ghost"
size="icon"
className="text-gray-400 hover:text-gray-900 h-9 w-9"
onClick={() => {/* Mark as spam logic */}}
>
<MessageSquare className="h-5 w-5" />
</Button>
<div className="flex items-center gap-1 flex-shrink-0 ml-auto">
<div className="flex items-center border-l border-gray-200 pl-4">
<Button
variant="ghost"
size="icon"
className="text-gray-400 hover:text-gray-900 h-9 w-9"
onClick={() => handleReply('reply')}
>
<Reply className="h-4 w-4" />
</Button>
<Button
variant="ghost"
size="icon"
className="text-gray-400 hover:text-gray-900 h-9 w-9"
onClick={() => handleReply('replyAll')}
>
<ReplyAll className="h-4 w-4" />
</Button>
<Button
variant="ghost"
size="icon"
className="text-gray-400 hover:text-gray-900 h-9 w-9"
onClick={() => handleReply('forward')}
>
<Forward className="h-4 w-4" />
</Button>
<Button
variant="ghost"
size="icon"
className="text-gray-400 hover:text-gray-900 h-9 w-9"
onClick={(e) => toggleStarred(selectedEmail.id, e)}
>
<Star className={`h-4 w-4 ${selectedEmail.starred ? 'fill-yellow-400 text-yellow-400' : ''}`} />
</Button>
<Button
variant="ghost"
size="icon"
className="text-gray-400 hover:text-gray-900 h-9 w-9"
onClick={() => {/* Add to folder logic */}}
>
<FolderOpen className="h-4 w-4" />
</Button>
<Button
variant="ghost"
size="icon"
className="text-gray-400 hover:text-gray-900 h-9 w-9"
onClick={() => {/* Mark as spam logic */}}
>
<MessageSquare className="h-4 w-4" />
</Button>
</div>
</div>
</div>
</div>