Sergey Antropoff
82 lines
5.4 KiB
HTML
82 lines
5.4 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru" data-theme="dark">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<title>{% block title %}{{ title or "Wrapped" }}{% endblock %}</title>
|
||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Outfit:wght@400;500;600;700&display=swap" rel="stylesheet" />
|
||
<link rel="stylesheet" href="/static/css/app.css" />
|
||
<link rel="icon" href="/static/favicon.svg" type="image/svg+xml" />
|
||
<link rel="icon" href="/static/favicon.ico" sizes="any" />
|
||
<link rel="apple-touch-icon" href="/static/apple-touch-icon.png" />
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||
<link id="hljs-theme-dark" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.11.1/styles/github-dark.min.css" />
|
||
<link id="hljs-theme-light" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.11.1/styles/github.min.css" disabled />
|
||
{% block head %}{% endblock %}
|
||
</head>
|
||
<body>
|
||
<div class="bg-grid" aria-hidden="true"></div>
|
||
<header class="topbar">
|
||
<a class="brand" href="/">
|
||
<span class="brand-mark" aria-hidden="true">
|
||
<i class="fa-solid fa-shield-halved"></i>
|
||
</span>
|
||
<span class="brand-text">
|
||
<span class="brand-name">Wrapped</span>
|
||
<span class="brand-tagline" data-i18n="brand.tagline">Упакуй. Отправь. Исчезни.</span>
|
||
</span>
|
||
</a>
|
||
<div class="top-actions">
|
||
<button type="button" class="icon-btn" id="lang-toggle" title="Language" aria-label="Language">
|
||
<span id="lang-label">RU</span>
|
||
</button>
|
||
<button type="button" class="icon-btn" id="theme-toggle" title="Theme" aria-label="Theme">
|
||
<svg id="theme-icon-sun" class="icon hidden" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4"/></svg>
|
||
<svg id="theme-icon-moon" class="icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M21 14.5A8.5 8.5 0 1 1 9.5 3a7 7 0 0 0 11.5 11.5z"/></svg>
|
||
</button>
|
||
<button type="button" class="icon-btn" id="about-toggle" title="О проекте Wrapped" aria-label="О проекте Wrapped">
|
||
<i class="fa-solid fa-circle-question" aria-hidden="true"></i>
|
||
</button>
|
||
</div>
|
||
</header>
|
||
<main class="shell">
|
||
{% block content %}{% endblock %}
|
||
</main>
|
||
<footer class="site-footer">
|
||
<p class="footer-copy">
|
||
© <span data-i18n="footer.copy.author">Сергей Антропов</span>
|
||
· <a href="https://devops.org.ru" target="_blank" rel="noopener noreferrer">devops.org.ru</a>
|
||
</p>
|
||
</footer>
|
||
|
||
<div id="about-modal" class="modal-root hidden" role="dialog" aria-modal="true" aria-labelledby="about-modal-title">
|
||
<div class="modal-backdrop" data-about-close></div>
|
||
<div class="modal-panel about-modal-panel" role="document">
|
||
<header class="about-modal-head">
|
||
<h2 class="modal-title" id="about-modal-title" data-i18n="about.title">О проекте Wrapped</h2>
|
||
<span class="about-version" title="Version">{{ app_version_label() }}</span>
|
||
</header>
|
||
<div class="about-modal-body">
|
||
<p data-i18n="about.p1">Wrapped — сервис одноразовой безопасной передачи текста, изображений и файлов.</p>
|
||
<p data-i18n="about.p2">Можно отправить заметку или код, а также вложения: документы, архивы, скриншоты (drag-and-drop, выбор с диска или вставка из буфера). И текст, и файлы шифруются в браузере до загрузки — на сервер уходит только ciphertext.</p>
|
||
<p data-i18n="about.p3">Сервер никогда не видит plaintext: зашифрованные данные лежат на сервере до тех пор, пока получатель не откроет ссылку с ключом и не расшифрует пакет.</p>
|
||
<p data-i18n="about.p4">После успешной расшифровки копия на сервере уничтожается. Ключ шифрования живёт во фрагменте URL (#…) и не уходит на сервер вместе с запросом страницы. При желании wrap можно дополнительно защитить паролем.</p>
|
||
</div>
|
||
<div class="modal-actions">
|
||
<button type="button" class="btn primary" data-about-close data-i18n="about.close">Понятно</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.11.1/highlight.min.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||
<script src="/static/js/i18n.js"></script>
|
||
<script src="/static/js/theme.js"></script>
|
||
<script src="/static/js/ui.js"></script>
|
||
<script src="/static/js/about.js"></script>
|
||
<script src="/static/js/highlight-ui.js"></script>
|
||
{% block scripts %}{% endblock %}
|
||
</body>
|
||
</html>
|