<!-- Email Detail View --> <div class="email-detail" id="emailDetail"> <div class="empty-detail"> ✨ Select an email to read its content </div> </div> </div>
.detail-subject { font-size: 1.3rem; font-weight: 600; margin-bottom: 10px; }
.message-sender { font-weight: 600; color: #2d3748; margin-bottom: 5px; }
// if selected message still exists, keep it selected, else clear detail if (selectedMessageId && currentMessages.find(m => m.id === selectedMessageId)) { displayMessageDetail(selectedMessageId); } else if (currentMessages.length > 0 && !selectedMessageId) { // auto-select first message selectAndDisplayMessage(currentMessages[0].id); } else if (currentMessages.length === 0) { document.getElementById('emailDetail').innerHTML = '<div class="empty-detail">📭 Inbox is empty</div>'; selectedMessageId = null; } } temp mail script
.copy-btn, .refresh-btn { background: #667eea; color: white; border: none; padding: 8px 20px; border-radius: 8px; cursor: pointer; font-weight: 600; transition: all 0.2s; }
.empty-detail { display: flex; align-items: center; justify-content: center; height: 100%; color: #a0aec0; font-style: italic; }
.message-subject { font-size: 0.85rem; color: #4a5568; margin-bottom: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } !-- Email Detail View -->
.email-display { flex: 1; display: flex; align-items: center; gap: 10px; background: white; border: 1px solid #cbd5e0; border-radius: 8px; padding: 8px 15px; }
.detail-meta { font-size: 0.8rem; color: #718096; margin-bottom: 5px; }
.header p { opacity: 0.8; font-size: 0.9rem; } div class="email-detail" id="emailDetail">
// Initialize and request notification permission function init() { if (Notification.permission !== "granted" && Notification.permission !== "denied") { Notification.requestPermission(); } setNewEmail(); // Event listeners document.getElementById('copyBtn').addEventListener('click', copyEmailToClipboard); document.getElementById('newEmailBtn').addEventListener('click', () => setNewEmail()); document.getElementById('refreshInboxBtn').addEventListener('click', manualRefresh); }
function selectAndDisplayMessage(msgId) { selectedMessageId = msgId; refreshInboxUI(); // re-render to show active state displayMessageDetail(msgId); }
/* Email Detail View */ .email-detail { width: 65%; background: #fff; display: flex; flex-direction: column; }
/* Inbox Sidebar */ .inbox-sidebar { width: 35%; background: #fff; border-right: 1px solid #e2e8f0; display: flex; flex-direction: column; }
// Set a new email (reset inbox) function setNewEmail() { const newEmailAddr = generateNewEmail(); currentEmail = newEmailAddr; selectedMessageId = null; // Ensure we have storage for this email (maybe empty initially) if (!loadMessagesForEmail(currentEmail).length) { saveMessagesForEmail(currentEmail, []); } document.getElementById('emailAddress').innerText = currentEmail; refreshInboxUI(); // Restart auto email generation for new address if (intervalId) clearInterval(intervalId); startAutoGenerateEmails();