Joachim Hummel
96bc2286a5
- New /api/assets endpoint to list available icons from assets folder - Dynamic footer generation with multiple selectable icons - Thumbnail grid UI for asset selection in the mail form - Selected icons are embedded as CID attachments in emails Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
73 lines
2.1 KiB
HTML
73 lines
2.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Mail-Service</title>
|
|
<link rel="stylesheet" href="style.css">
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<div class="panel form-panel">
|
|
<h2>Mail Versenden</h2>
|
|
<form id="mailForm">
|
|
<div class="form-group">
|
|
<label for="to">Empfänger *</label>
|
|
<input type="email" id="to" name="to" required placeholder="empfaenger@example.com">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="cc">CC</label>
|
|
<input type="email" id="cc" name="cc" placeholder="cc@example.com">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="subject">Betreff *</label>
|
|
<input type="text" id="subject" name="subject" required placeholder="Betreff der E-Mail">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label>Format</label>
|
|
<div class="radio-group">
|
|
<label>
|
|
<input type="radio" name="format" value="text" checked> Text
|
|
</label>
|
|
<label>
|
|
<input type="radio" name="format" value="html"> HTML
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="body">Nachricht *</label>
|
|
<textarea id="body" name="body" required rows="8" placeholder="Ihre Nachricht..."></textarea>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label>Footer-Icons</label>
|
|
<div id="assetGrid" class="asset-grid">
|
|
<p class="loading-message">Lade Assets...</p>
|
|
</div>
|
|
</div>
|
|
|
|
<button type="submit" id="submitBtn">Senden</button>
|
|
</form>
|
|
|
|
<div id="status" class="status hidden"></div>
|
|
</div>
|
|
|
|
<div class="panel history-panel">
|
|
<div class="history-header">
|
|
<h2>Versand-Historie</h2>
|
|
<button id="clearHistory" class="btn-secondary">Leeren</button>
|
|
</div>
|
|
<div id="historyList" class="history-list">
|
|
<p class="empty-message">Keine E-Mails gesendet</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="script.js"></script>
|
|
</body>
|
|
</html>
|