Files
summary-builder/template-meeting.html

174 lines
6.6 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Саммари встречи — {ТЕМА}</title>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
<style>
*{margin:0;padding:0;box-sizing:border-box}
:root{
--bg:#f0f1f3;--white:#fff;--text:#1a1a2e;--sub:#6b7280;
--accent:#2563eb;--accent-dark:#1e40af;
--border:#d1d5db;--green:#10b981;
}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--text);line-height:1.7}
.doc-page{
width:210mm;max-width:100%;min-height:297mm;
background:var(--white);margin:24px auto;padding:50px 60px;
box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.08);
position:relative;
}
.cover-page{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}
.cover-badge{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);font-weight:700;margin-bottom:24px}
.cover-line{width:60px;height:3px;background:var(--accent);margin:0 auto 32px}
.cover-page h1{font-size:28px;font-weight:800;line-height:1.3;margin-bottom:12px;color:var(--text)}
.cover-page .subtitle{font-size:15px;color:var(--sub);margin-bottom:48px;max-width:500px;line-height:1.6}
.cover-page .meeting-meta{margin-top:40px;font-size:14px;color:var(--text);line-height:2.2}
.cover-page .meeting-meta b{color:var(--accent)}
.cover-page .date{font-size:13px;color:var(--sub);margin-top:48px}
.section{margin-bottom:32px}
.section-title{font-size:17px;font-weight:800;color:var(--accent);margin-bottom:6px;padding-bottom:6px;border-bottom:2px solid var(--accent)}
.section p{margin-bottom:10px;font-size:14px;line-height:1.8}
.table-wrap{margin:14px 0}
table{width:100%;border-collapse:collapse;border:1px solid var(--border)}
table th{background:var(--accent-dark);color:#fff;padding:10px 14px;text-align:center;font-size:12px;font-weight:700;border:1px solid var(--accent-dark)}
table td{padding:10px 14px;border:1px solid var(--border);font-size:13px;text-align:center}
table td:first-child{text-align:left}
.sub-title{font-size:14px;font-weight:700;margin:18px 0 8px;color:var(--text)}
.checklist{list-style:none;padding:0;margin:10px 0}
.checklist li{padding:4px 0;font-size:13px;line-height:1.7}
.checklist li::before{content:'✓ ';color:var(--green);font-weight:700}
.highlight-box{background:#eff6ff;border-left:3px solid var(--accent);padding:12px 16px;margin:12px 0;font-size:13px;line-height:1.7}
.quote-item{padding:10px 0;border-bottom:1px solid var(--border);font-size:13px;line-height:1.7}
.quote-item:last-child{border-bottom:none}
.quote-text{font-style:italic;color:var(--sub)}
.quote-author{font-weight:600;color:var(--text);margin-top:4px;font-size:12px}
.action-status{display:inline-block;padding:2px 8px;font-size:11px;font-weight:600;border-radius:3px}
.status-urgent{background:#fef2f2;color:#dc2626}
.status-normal{background:#eff6ff;color:#2563eb}
.status-done{background:#ecfdf5;color:#059669}
.doc-footer{text-align:center;padding:24px 0;color:var(--sub);font-size:11px;border-top:1px solid var(--border);margin-top:32px}
@media(max-width:600px){
.doc-page{margin:8px;padding:24px 20px;min-height:auto}
.cover-page h1{font-size:22px}
}
@media print{
body{background:#fff}
.doc-page{box-shadow:none;margin:0;padding:40px 50px;width:100%}
.cover-page{min-height:100vh;page-break-after:always}
.section{page-break-inside:avoid}
}
</style>
</head>
<body>
<!-- COVER PAGE -->
<div class="doc-page cover-page">
<div class="cover-badge">САММАРИ ВСТРЕЧИ</div>
<div class="cover-line"></div>
<h1>{Тема встречи}</h1>
<div class="subtitle">{Краткое описание — 1-2 предложения о чём была встреча}</div>
<div class="meeting-meta">
<b>Дата:</b> {Дата}<br>
<b>Участники:</b> {Список участников}<br>
<b>Тип:</b> {Тип встречи}
</div>
</div>
<!-- CONTENT PAGE 1 -->
<div class="doc-page">
<div class="section">
<div class="section-title">Контекст встречи</div>
<p>{О чём встреча — 2-3 предложения с описанием цели, предыстории и ожиданий}</p>
</div>
<div class="section">
<div class="section-title">Ключевые темы</div>
<div class="table-wrap">
<table>
<tr><th>Тема</th><th>Суть обсуждения</th></tr>
<tr><td>{Тема 1}</td><td>{Что обсуждали}</td></tr>
<tr><td>{Тема 2}</td><td>{Что обсуждали}</td></tr>
</table>
</div>
</div>
<div class="section">
<div class="section-title">Решения</div>
<div class="table-wrap">
<table>
<tr><th>Решение</th><th>Ответственный</th><th>Комментарий</th></tr>
<tr><td>{Решение}</td><td>{Кто}</td><td>{Детали}</td></tr>
</table>
</div>
</div>
<div class="section">
<div class="section-title">Действия</div>
<div class="table-wrap">
<table>
<tr><th>Задача</th><th>Исполнитель</th><th>Срок</th></tr>
<tr><td>{Задача}</td><td>{Кто}</td><td>{Когда}</td></tr>
</table>
</div>
</div>
</div>
<!-- CONTENT PAGE 2 (optional — only if relevant) -->
<div class="doc-page">
<div class="section">
<div class="section-title">Возражения / Вопросы</div>
<div class="table-wrap">
<table>
<tr><th>Вопрос / Возражение</th><th>Кто озвучил</th><th>Комментарий / Ответ</th></tr>
<tr><td>{Вопрос}</td><td>{Кто}</td><td>{Ответ}</td></tr>
</table>
</div>
</div>
<div class="section">
<div class="section-title">Ключевые цитаты</div>
<div class="quote-item">
<div class="quote-text">"— {Цитата}"</div>
<div class="quote-author">{Кто сказал}</div>
</div>
</div>
<div class="section">
<div class="section-title">Следующие шаги</div>
<ol style="padding-left:20px;line-height:2.2;font-size:13px">
<li>{Шаг 1}</li>
<li>{Шаг 2}</li>
<li>{Шаг 3}</li>
</ol>
</div>
<div class="section">
<div class="section-title">Рекомендации</div>
<ul class="checklist">
<li>{Рекомендация 1}</li>
<li>{Рекомендация 2}</li>
</ul>
</div>
<div class="doc-footer">Сгенерировано через summary.edemium.ru</div>
</div>
</body>
</html>