This commit is contained in:
2026-03-22 00:43:56 +08:00
parent 557e25d187
commit cd40757167
6 changed files with 86 additions and 73 deletions

View File

@@ -297,29 +297,29 @@
<nav>
<ul id="nav-folder-list" role="list">
<li class="nav-item active" onclick="selectFolder('inbox')" role="menuitem" aria-current="page">
<li id="nav-inbox" class="nav-item active" onclick="selectFolder('inbox')" role="menuitem" aria-current="page">
<div style="display:flex; align-items:center;">
<span class="nav-icon" aria-hidden="true">📥</span> Inbox
</div>
<span class="unread-badge" id="badge-inbox" aria-label="Unread messages count">3</span>
</li>
<li class="nav-item" onclick="selectFolder('sent')" role="menuitem">
<li id="nav-sent" class="nav-item" onclick="selectFolder('sent')" role="menuitem">
<div style="display:flex; align-items:center;">
<span class="nav-icon" aria-hidden="true">📤</span> Sent
</div>
</li>
<li class="nav-item" onclick="selectFolder('drafts')" role="menuitem">
<li id="nav-drafts" class="nav-item" onclick="selectFolder('drafts')" role="menuitem">
<div style="display:flex; align-items:center;">
<span class="nav-icon" aria-hidden="true">📝</span> Drafts
</div>
<span class="unread-badge" aria-label="Draft messages count">1</span>
</li>
<li class="nav-item" onclick="selectFolder('junk')" role="menuitem">
<li id="nav-junk" class="nav-item" onclick="selectFolder('junk')" role="menuitem">
<div style="display:flex; align-items:center;">
<span class="nav-icon" aria-hidden="true">🚫</span> Junk
</div>
</li>
<li class="nav-item" onclick="selectFolder('trash')" role="menuitem">
<li id="nav-trash" class="nav-item" onclick="selectFolder('trash')" role="menuitem">
<div style="display:flex; align-items:center;">
<span class="nav-icon" aria-hidden="true">🗑️</span> Trash
</div>
@@ -350,9 +350,9 @@
<main class="mail-list-panel" role="main" aria-label="Mail list">
<div class="toolbar" role="toolbar" aria-label="Mail actions">
<div class="tool-icon" title="Select All" role="button" tabindex="0"><label><input type="checkbox" style="margin:0;" id="select-all-checkbox" onclick="toggleSelectAll()" aria-label="Select all emails in current folder"></label></div>
<button class="tool-icon" title="Refresh" onclick="refreshMail()" aria-label="Refresh mail list">🔄</button>
<button class="tool-icon" title="Mark as Read" onclick="markSelectedAsRead()" aria-label="Mark selected emails as read">✉️</button>
<button class="tool-icon" title="Delete" onclick="deleteSelected()" aria-label="Delete selected emails">🗑️</button>
<button id="btn-toolbar-refresh" class="tool-icon" title="Refresh" onclick="refreshMail()" aria-label="Refresh mail list">🔄</button>
<button id="btn-toolbar-mark-read" class="tool-icon" title="Mark as Read" onclick="markSelectedAsRead()" aria-label="Mark selected emails as read">✉️</button>
<button id="btn-toolbar-delete" class="tool-icon" title="Delete" onclick="deleteSelected()" aria-label="Delete selected emails">🗑️</button>
<div style="flex:1"></div>
<div style="font-size:12px; color:var(--text-secondary);">Sort: <b>Date</b></div>
</div>
@@ -394,7 +394,7 @@
</div>
</div>
<div class="modal-footer">
<button class="btn-compose" style="width:100px;" onclick="sendEmail()" aria-label="Send email">Send</button>
<button id="btn-compose-send" class="btn-compose" style="width:100px;" onclick="sendEmail()" aria-label="Send email">Send</button>
<button style="color:var(--text-secondary); background:none; border:none; cursor:pointer;" onclick="closeCompose()" aria-label="Discard email">Discard</button>
</div>
</div>
@@ -591,6 +591,7 @@
filtered.forEach(email => {
const el = document.createElement('div');
el.id = `mail-item-${email.id}`;
el.className = `mail-item ${email.unread ? 'unread' : ''} ${selectedEmailId === email.id ? 'selected' : ''}`;
el.onclick = () => openEmail(email.id);
@@ -603,7 +604,7 @@
// Insert Checkbox in HTML
el.innerHTML = `
<div class="mail-left" onclick="event.stopPropagation()">
<input type="checkbox" class="mail-checkbox" ${email.checked ? 'checked' : ''} onchange="toggleEmailCheck(${email.id})">
<input type="checkbox" id="check-mail-${email.id}" class="mail-checkbox" ${email.checked ? 'checked' : ''} onchange="toggleEmailCheck(${email.id})" aria-label="Select email from ${email.sender}">
</div>
<div class="mail-content-block">
<div class="mail-header-row">
@@ -723,9 +724,9 @@
</div>
</div>
<div class="email-actions">
<button class="tool-icon" title="Reply" onclick="replyEmail(${email.id})">↩️</button>
<button class="tool-icon" title="Forward" onclick="forwardEmail(${email.id})">➡️</button>
<button class="tool-icon" title="Delete" onclick="deleteEmail(${email.id})">🗑️</button>
<button id="btn-reply-${email.id}" class="tool-icon" title="Reply" onclick="replyEmail(${email.id})" aria-label="Reply to email">↩️</button>
<button id="btn-forward-${email.id}" class="tool-icon" title="Forward" onclick="forwardEmail(${email.id})" aria-label="Forward email">➡️</button>
<button id="btn-delete-${email.id}" class="tool-icon" title="Delete" onclick="deleteEmail(${email.id})" aria-label="Delete email">🗑️</button>
</div>
</div>
</div>