Files
2026-07-16 05:48:12 -05:00

113 lines
5.2 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Campaign composer · Portal · MKDRealtor.com</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700%7CPoppins:400,600,700">
<link rel="stylesheet" href="proposal.css">
</head>
<body class="portal">
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="portal-shell">
<aside class="portal-sidebar">
<a class="portal-brand" href="portal-dashboard.html"><img src="brand/exit_logo.png" alt="EXIT Realty"><span>MKDRealtor.com</span></a>
<nav class="portal-nav">
<div class="nav-section">Overview</div>
<a class="" href="portal-dashboard.html">Dashboard</a>
<a class="" href="portal-leads.html">Leads</a>
<a class="" href="portal-analytics.html">Analytics</a>
<div class="nav-section">Outreach</div>
<a class="" href="portal-contacts.html">Mailing list</a>
<a class="active" href="portal-campaign.html">Campaigns</a>
<a class="" href="portal-postcard-designer.html">Postcard design</a>
<div class="nav-section">Social</div>
<a class="" href="portal-social.html">Compose & preview</a>
<a class="" href="portal-social-accounts.html">Accounts</a>
</nav>
</aside>
<div class="portal-main">
<div class="portal-topbar">
<h1>Campaign composer</h1>
<div class="portal-user">Signed in as <strong>Monica Dhillon</strong> · <a href="portal-login.html" style="color:#00626c">Sign out</a></div>
</div>
<div class="portal-content">
<div class="proposal-note"><strong>UX note:</strong> Email/SMS/postcard composer. Email engagement (opens/clicks) from SMTP2GO. Postcards use the live designer.</div>
<div class="channel-tabs">
<a class="active" href="#email">Email</a>
<a href="#sms">SMS</a>
<a href="portal-postcard-designer.html">Postcard</a>
</div>
<div class="split">
<div class="panel">
<div class="panel-h"><h2>Compose</h2></div>
<div class="panel-b form-grid">
<div class="field"><label>Campaign name</label><input value="Spring seller tips"></div>
<div class="field"><label>Template</label>
<select><option>Seller tips — newsletter</option><option>Open house invite</option><option>Just listed</option><option>(blank)</option></select>
</div>
<div class="field"><label>Subject</label><input value="3 things sellers overlook this spring"></div>
<div class="field"><label>Body</label>
<textarea style="min-height:140px">Hi {{first_name}},
A few timing tips for listing this season…
— Monica</textarea>
<div class="hint">Merge tags: {{first_name}}, {{last_name}}. Unsubscribe link appended. Open/click tracking via SMTP2GO.</div>
</div>
<div class="form-grid cols-2">
<div class="field"><label>Recipients</label><input value="186 consented email contacts" readonly></div>
<div class="field"><label>Schedule</label><input type="datetime-local" value="2026-07-18T10:00"></div>
</div>
<div style="display:flex;gap:8px;flex-wrap:wrap">
<button class="btn btn-primary" type="button">Schedule send</button>
<button class="btn btn-ghost" type="button">Save draft</button>
</div>
</div>
</div>
<div>
<div class="panel">
<div class="panel-h"><h2>Preview</h2></div>
<div class="panel-b"><div class="preview-pane">
<strong>Subject:</strong> 3 things sellers overlook this spring<br><br>
Hi Jordan,<br><br>
A few timing tips for listing this season…<br><br>
— Monica<br><br>
<span class="muted" style="font-size:12px"><a href="public-unsubscribe.html">Unsubscribe</a> · Monica Dhillon · MKDRealtor.com</span>
</div></div>
</div>
<div class="panel">
<div class="panel-h"><h2>After send</h2></div>
<div class="panel-b" style="font-size:14px">
<p>SMTP2GO reports <strong>opens, clicks, bounces, complaints</strong> via webhooks.</p>
<a class="btn btn-sm btn-primary" href="portal-campaign-report.html">View sample engagement report</a>
<p class="muted" style="margin:12px 0 0;font-size:13px">Postcard campaigns: design in <a href="portal-postcard-designer.html">Postcard designer</a>, then select recipients with addresses.</p>
</div>
</div>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>Recent campaigns</h2></div>
<div class="panel-b" style="padding:0">
<table class="table">
<thead><tr><th>Name</th><th>Channel</th><th>Recipients</th><th>Engagement</th><th>Status</th><th></th></tr></thead>
<tbody>
<tr><td>March mailer</td><td>Postcard</td><td>120</td><td></td><td><span class="badge badge-delivered">Delivered</span></td><td></td></tr>
<tr><td>Open house SMS</td><td>SMS</td><td>42</td><td>delivered 40</td><td><span class="badge badge-sent">Sent</span></td><td></td></tr>
<tr><td>Spring seller tips</td><td>Email</td><td>186</td><td>94 opens · 27 clicks</td><td><span class="badge badge-sent">Sent</span></td><td><a href="portal-campaign-report.html">Report</a></td></tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</body>
</html>