432 lines
25 KiB
HTML
432 lines
25 KiB
HTML
<section class="accounts-settings">
|
|
<div class="accounts-header">
|
|
<h1>Connected Accounts</h1>
|
|
<p>Manage your social media and messaging channel integrations</p>
|
|
</div>
|
|
|
|
<div class="accounts-grid">
|
|
<div class="account-category">
|
|
<div class="category-header">
|
|
<h2>Social Media</h2>
|
|
<span class="category-count" id="socialCount">0 connected</span>
|
|
</div>
|
|
<div class="accounts-list" hx-get="/api/settings/accounts/social" hx-trigger="load" hx-swap="innerHTML">
|
|
<div class="account-card">
|
|
<div class="account-icon instagram">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<rect x="2" y="2" width="20" height="20" rx="5" ry="5"></rect>
|
|
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"></path>
|
|
<line x1="17.5" y1="6.5" x2="17.51" y2="6.5"></line>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Instagram</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('instagram')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon facebook">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Facebook</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('facebook')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon twitter">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<path d="M23 3a10.9 10.9 0 0 1-3.14 1.53 4.48 4.48 0 0 0-7.86 3v1A10.66 10.66 0 0 1 3 4s-4 9 5 13a11.64 11.64 0 0 1-7 2c9 5 20 0 20-11.5a4.5 4.5 0 0 0-.08-.83A7.72 7.72 0 0 0 23 3z"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Twitter / X</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('twitter')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon linkedin">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"></path>
|
|
<rect x="2" y="9" width="4" height="12"></rect>
|
|
<circle cx="4" cy="4" r="2"></circle>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">LinkedIn</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('linkedin')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon bluesky">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<circle cx="12" cy="12" r="10"></circle>
|
|
<path d="M8 12a4 4 0 0 1 8 0"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Bluesky</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('bluesky')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon threads">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2z"></path>
|
|
<path d="M12 6c-3.31 0-6 2.69-6 6s2.69 6 6 6 6-2.69 6-6-2.69-6-6-6z"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Threads</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('threads')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon tiktok">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<path d="M9 12a4 4 0 1 0 4 4V4a5 5 0 0 0 5 5"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">TikTok</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('tiktok')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon youtube">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<path d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.46a2.78 2.78 0 0 0-1.94 2A29 29 0 0 0 1 11.75a29 29 0 0 0 .46 5.33A2.78 2.78 0 0 0 3.4 19c1.72.46 8.6.46 8.6.46s6.88 0 8.6-.46a2.78 2.78 0 0 0 1.94-2 29 29 0 0 0 .46-5.25 29 29 0 0 0-.46-5.33z"></path>
|
|
<polygon points="9.75 15.02 15.5 11.75 9.75 8.48 9.75 15.02"></polygon>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">YouTube</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('youtube')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon pinterest">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<circle cx="12" cy="12" r="10"></circle>
|
|
<path d="M8 12c0-2.2 1.8-4 4-4s4 1.8 4 4c0 2.5-2 4-4 6-2-2-4-3.5-4-6z"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Pinterest</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('pinterest')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon reddit">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<circle cx="12" cy="12" r="10"></circle>
|
|
<circle cx="8" cy="12" r="1.5"></circle>
|
|
<circle cx="16" cy="12" r="1.5"></circle>
|
|
<path d="M8 16c1.5 1.5 5 1.5 8 0"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Reddit</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('reddit')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon snapchat">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2z"></path>
|
|
<path d="M12 8c-2 0-3 1.5-3 3.5 0 1 .5 2 1.5 2.5-1 .5-2 1-2 1.5 0 1 2 2 3.5 2s3.5-1 3.5-2c0-.5-1-1-2-1.5 1-.5 1.5-1.5 1.5-2.5 0-2-1-3.5-3-3.5z"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Snapchat</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('snapchat')">Connect</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="account-category">
|
|
<div class="category-header">
|
|
<h2>Messaging</h2>
|
|
<span class="category-count" id="messagingCount">0 connected</span>
|
|
</div>
|
|
<div class="accounts-list" hx-get="/api/settings/accounts/messaging" hx-trigger="load" hx-swap="innerHTML">
|
|
<div class="account-card">
|
|
<div class="account-icon discord">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<path d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0 12.64 12.64 0 0 0-.617-1.25.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057 19.9 19.9 0 0 0 5.993 3.03.078.078 0 0 0 .084-.028 14.09 14.09 0 0 0 1.226-1.994.076.076 0 0 0-.041-.106 13.107 13.107 0 0 1-1.872-.892.077.077 0 0 1-.008-.128 10.2 10.2 0 0 0 .372-.292.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127 12.299 12.299 0 0 1-1.873.892.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028 19.839 19.839 0 0 0 6.002-3.03.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03z"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Discord</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('discord')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon whatsapp">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">WhatsApp Business</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('whatsapp')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon telegram">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<line x1="22" y1="2" x2="11" y2="13"></line>
|
|
<polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Telegram</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('telegram')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon twilio">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Twilio SMS</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('twilio')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon wechat">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<path d="M8.5 10a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"></path>
|
|
<path d="M13.5 10a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"></path>
|
|
<path d="M9 16a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"></path>
|
|
<path d="M15 16a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"></path>
|
|
<path d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12c0 1.6.376 3.112 1.043 4.453L2 22l5.547-1.043A9.96 9.96 0 0 0 12 22z"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">WeChat</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('wechat')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon teams">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
|
|
<circle cx="9" cy="7" r="4"></circle>
|
|
<path d="M23 21v-2a4 4 0 0 0-3-3.87"></path>
|
|
<path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Microsoft Teams</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('teams')">Connect</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="account-category">
|
|
<div class="category-header">
|
|
<h2>Email</h2>
|
|
<span class="category-count" id="emailCount">0 connected</span>
|
|
</div>
|
|
<div class="accounts-list" hx-get="/api/settings/accounts/email" hx-trigger="load" hx-swap="innerHTML">
|
|
<div class="account-card">
|
|
<div class="account-icon gmail">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
|
|
<polyline points="22,6 12,13 2,6"></polyline>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Gmail / Google Workspace</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('gmail')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon outlook">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
|
|
<polyline points="22,6 12,13 2,6"></polyline>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Outlook / Office 365</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="connectAccount('outlook')">Connect</button>
|
|
</div>
|
|
|
|
<div class="account-card">
|
|
<div class="account-icon smtp">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="1.5" fill="none">
|
|
<rect x="2" y="3" width="20" height="14" rx="2" ry="2"></rect>
|
|
<line x1="8" y1="21" x2="16" y2="21"></line>
|
|
<line x1="12" y1="17" x2="12" y2="21"></line>
|
|
</svg>
|
|
</div>
|
|
<div class="account-info">
|
|
<span class="account-name">Custom SMTP</span>
|
|
<span class="account-status disconnected">Not connected</span>
|
|
</div>
|
|
<button class="btn-connect" onclick="showSmtpModal()">Configure</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<dialog id="accountModal" class="account-modal">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h2 id="modalTitle">Connect Account</h2>
|
|
<button class="btn-close" onclick="closeModal('accountModal')">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="2" fill="none">
|
|
<line x1="18" y1="6" x2="6" y2="18"></line>
|
|
<line x1="6" y1="6" x2="18" y2="18"></line>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body" id="modalBody">
|
|
<div class="oauth-loading">
|
|
<div class="spinner"></div>
|
|
<p>Redirecting to authorization...</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</dialog>
|
|
|
|
<dialog id="smtpModal" class="account-modal">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h2>Configure SMTP Server</h2>
|
|
<button class="btn-close" onclick="closeModal('smtpModal')">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="2" fill="none">
|
|
<line x1="18" y1="6" x2="6" y2="18"></line>
|
|
<line x1="6" y1="6" x2="18" y2="18"></line>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form id="smtpForm" hx-post="/api/settings/accounts/smtp" hx-swap="none">
|
|
<div class="form-group">
|
|
<label for="smtpHost">SMTP Host</label>
|
|
<input type="text" id="smtpHost" name="host" required placeholder="smtp.example.com">
|
|
</div>
|
|
<div class="form-row">
|
|
<div class="form-group">
|
|
<label for="smtpPort">Port</label>
|
|
<input type="number" id="smtpPort" name="port" required value="587">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="smtpSecurity">Security</label>
|
|
<select id="smtpSecurity" name="security">
|
|
<option value="tls">TLS</option>
|
|
<option value="ssl">SSL</option>
|
|
<option value="none">None</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="smtpUsername">Username</label>
|
|
<input type="text" id="smtpUsername" name="username" required placeholder="your@email.com">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="smtpPassword">Password</label>
|
|
<input type="password" id="smtpPassword" name="password" required placeholder="••••••••">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="smtpFrom">From Address</label>
|
|
<input type="email" id="smtpFrom" name="from_address" required placeholder="noreply@example.com">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="smtpFromName">From Name</label>
|
|
<input type="text" id="smtpFromName" name="from_name" placeholder="Your Company">
|
|
</div>
|
|
<div class="form-actions">
|
|
<button type="button" class="btn-secondary" onclick="testSmtpConnection()">Test Connection</button>
|
|
<button type="submit" class="btn-primary">Save Configuration</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</dialog>
|
|
|
|
<dialog id="accountDetailsModal" class="account-modal wide">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h2 id="detailsTitle">Account Details</h2>
|
|
<button class="btn-close" onclick="closeModal('accountDetailsModal')">
|
|
<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="2" fill="none">
|
|
<line x1="18" y1="6" x2="6" y2="18"></line>
|
|
<line x1="6" y1="6" x2="18" y2="18"></line>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body" id="detailsBody">
|
|
<div class="account-details-grid">
|
|
<div class="detail-section">
|
|
<h3>Connection Status</h3>
|
|
<div class="status-indicator connected">
|
|
<span class="status-dot"></span>
|
|
<span>Connected</span>
|
|
</div>
|
|
<p class="connected-as">Connected as: <strong id="connectedAccount">@username</strong></p>
|
|
<p class="connected-since">Since: <span id="connectedSince">January 15, 2025</span></p>
|
|
</div>
|
|
<div class="detail-section">
|
|
<h3>Permissions</h3>
|
|
<ul class="permissions-list" id="permissionsList">
|
|
<li>
|
|
<svg viewBox="0 0 24 24" width="16" height="16" stroke="currentColor" stroke-width="2" fill="none">
|
|
<polyline points="20 6 9 17 4 12"></polyline>
|
|
</svg>
|
|
Read posts
|
|
</li>
|
|
<li>
|
|
<svg viewBox="0 0 24 24" width="16" height="16" stroke="currentColor" stroke-width="2" fill="none">
|
|
<polyline points="20 6 9 17 4 12"></polyline>
|
|
</svg>
|
|
Create posts
|
|
</li>
|
|
<li>
|
|
<svg viewBox="0 0 24 24" width="16" height="16" stroke="currentColor" stroke-width="2" fill="none">
|