From b77d75f05fb2059389c05f6c01484e0cd12e796e Mon Sep 17 00:00:00 2001 From: Bobby <30593201+luciferreeves@users.noreply.github.com> Date: Wed, 24 Dec 2025 13:50:07 +0530 Subject: feat: introduce email folder synchronization and management, refactor email services, and update UI styles --- static/css/main.css | 85 ++++++++++++++++++++++++++++++++++------------------- 1 file changed, 55 insertions(+), 30 deletions(-) (limited to 'static') diff --git a/static/css/main.css b/static/css/main.css index 84a1d59..de658ba 100644 --- a/static/css/main.css +++ b/static/css/main.css @@ -583,19 +583,19 @@ input[type="date"]:focus { background: var(--bg-primary); border-right: 1px solid var(--border-color); overflow-y: auto; - padding: 4px; + padding: 0px; } .email-row { display: grid; - grid-template-columns: 18px 18px 1fr 70px; - gap: 6px; + grid-template-columns: 16px 1fr 64px; + gap: 8px; align-items: center; - padding: 8px; + padding: 8px 10px; background: var(--bg-secondary); - border: 1px solid var(--border-color); - margin-bottom: 3px; + border-bottom: 1px solid var(--border-color); cursor: pointer; + transition: background 0.1s; } .email-row:hover { @@ -603,57 +603,66 @@ input[type="date"]:focus { } .email-row.active { - border-left: 2px solid var(--accent-primary); + background: var(--bg-tertiary); + border-left: 3px solid var(--accent-primary); + padding-left: 7px; } .email-row.unread { - border-left: 2px solid var(--accent-tertiary); + border-left: 3px solid var(--accent-tertiary); + padding-left: 7px; } .email-row.unread .email-from, .email-row.unread .email-subject { font-weight: bold; + color: var(--text-primary); } -.email-checkbox input { - width: 14px; - height: 14px; +.email-flag { + width: 16px; + height: 16px; + font-size: 14px; + color: var(--text-muted); cursor: pointer; + user-select: none; + display: flex; + align-items: center; + justify-content: center; } -.email-flag { - width: 14px; - height: 14px; - opacity: 0.3; - cursor: pointer; +.email-flag:hover { + color: var(--accent-secondary); } .email-flag.flagged { - opacity: 1; + color: var(--accent-secondary); } .email-info { overflow: hidden; + min-width: 0; } .email-from { font-size: 11px; - margin-bottom: 2px; + color: var(--text-secondary); + margin-bottom: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .email-subject { - color: var(--accent-primary); - font-size: 11px; - margin-bottom: 2px; + color: var(--text-primary); + font-size: 12px; + margin-bottom: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } -.email-preview { +.email-snippet { color: var(--text-muted); font-size: 10px; white-space: nowrap; @@ -665,12 +674,19 @@ input[type="date"]:focus { display: flex; flex-direction: column; align-items: flex-end; - gap: 2px; + gap: 4px; + flex-shrink: 0; } .email-date { color: var(--text-muted); - font-size: 9px; + font-size: 10px; + white-space: nowrap; +} + +.attachment-icon { + font-size: 12px; + color: var(--text-muted); } .empty-state { @@ -682,6 +698,21 @@ input[type="date"]:focus { font-size: 12px; } +.no-subject, +.no-content { + font-style: italic; + color: var(--text-muted); + opacity: 0.7; +} + +.email-preview { + color: var(--text-muted); + font-size: 10px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + .preview { background: var(--bg-primary); overflow-y: auto; @@ -696,12 +727,6 @@ input[type="date"]:focus { border-bottom: 1px solid var(--border-color); } -.email-subject { - color: var(--accent-primary); - font-size: 16px; - font-weight: bold; -} - .email-actions { display: flex; gap: 4px; -- cgit v1.2.3