feat(ui): serve the public offer at /offer/ with a landing footer link

The offer is the legal document a purchase accepts, needed before real-money intake goes live. Convert the source PDF to an editable ui/legal/offer_ru.md and render it to a standalone static dist/offer/index.html at build (a vite emit-offer plugin using marked); the landing container serves it at /offer/, with a bare /offer redirecting in. Add a small centered "Публичная оферта" footer link on the landing (ru/en) and a CI probe asserting /offer/ serves the page rather than silently falling through to the landing shell.
2026-07-09 16:03:50 +02:00
parent a118c63411
commit 625fc3135a
14 changed files with 355 additions and 6 deletions
@@ -123,7 +123,10 @@
    </div>
  </section>

-  <footer class="ft">{t('about.version', { v: __APP_VERSION__ })}</footer>
+  <footer class="ft">
+    <a class="offer" href="/offer/">{t('landing.offer')}</a>
+    <span>{t('about.version', { v: __APP_VERSION__ })}</span>
+  </footer>
 </main>

 <style>
@@ -275,8 +278,18 @@
  }
  .ft {
    margin-top: auto;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 6px;
    text-align: center;
    color: var(--text-muted);
    font-size: 0.8rem;
  }
+  .ft .offer {
+    color: inherit;
+  }
+  .ft .offer:hover {
+    color: var(--accent);
+  }
 </style>
@@ -275,6 +275,7 @@ export const en = {
  'landing.captionTelegram': 'Telegram',
  'landing.captionVK': 'VK',
  'landing.captionWeb': 'Web',
+  'landing.offer': 'Public offer',

  'install.title': 'Install the app',
  'install.subtitle': 'Put the app icon on your desktop (home screen) to open the game in one tap.',
@@ -275,6 +275,7 @@ export const ru: Record<MessageKey, string> = {
  'landing.captionTelegram': 'Telegram',
  'landing.captionVK': 'VK',
  'landing.captionWeb': 'Веб-версия',
+  'landing.offer': 'Публичная оферта',

  'install.title': 'Установить приложение',
  'install.subtitle': 'Поместите иконку приложения на рабочий стол (домашний экран), чтобы открывать игру одним нажатием.',
@@ -0,0 +1,23 @@
+import { describe, it, expect } from 'vitest';
+import { renderOfferHtml } from './offer';
+
+describe('renderOfferHtml', () => {
+  it('wraps rendered markdown in a standalone Russian HTML document', () => {
+    const html = renderOfferHtml('# Публичная оферта\n\nо заключении договора купли-продажи');
+    expect(html).toContain('<!doctype html>');
+    expect(html).toContain('lang="ru"');
+    expect(html).toContain('<title>Публичная оферта — Эрудит</title>');
+    // The markdown heading is rendered, not left as literal source.
+    expect(html).toContain('<h1>Публичная оферта</h1>');
+    expect(html).not.toContain('# Публичная оферта');
+    // A back link to the landing root is always present.
+    expect(html).toContain('href="/"');
+  });
+
+  it('renders headings, bold clause numbers and lists', () => {
+    const html = renderOfferHtml('## 2. Предмет\n\n**2.1.** Текст пункта.\n\n- первый\n- второй');
+    expect(html).toContain('<h2>2. Предмет</h2>');
+    expect(html).toContain('<strong>2.1.</strong>');
+    expect(html).toContain('<li>первый</li>');
+  });
+});
@@ -0,0 +1,93 @@
+import { marked } from 'marked';
+
+/**
+ * renderOfferHtml renders the public-offer markdown source into a standalone,
+ * self-contained HTML document served statically at `/offer/`. The build emits
+ * the result as `dist/offer/index.html` (see the `emit-offer` plugin in
+ * `vite.config.ts`), which the landing container serves.
+ *
+ * The input `markdown` is trusted repository content (the owner-edited
+ * `ui/legal/offer_ru.md`), not user input, so the rendered HTML is deliberately
+ * not sanitised. The page carries its own minimal light/dark styling so it needs
+ * neither the app bundle nor `app.css`.
+ */
+export function renderOfferHtml(markdown: string): string {
+  const body = marked.parse(markdown, { async: false }) as string;
+  return `<!doctype html>
+<html lang="ru">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>Публичная оферта — Эрудит</title>
+    <link rel="canonical" href="https://erudit-game.ru/offer/" />
+    <meta name="theme-color" media="(prefers-color-scheme: light)" content="#f3f4f6" />
+    <meta name="theme-color" media="(prefers-color-scheme: dark)" content="#0f1115" />
+    <style>
+      :root {
+        color-scheme: light dark;
+        --bg: #ffffff;
+        --text: #1a1c20;
+        --accent: #2563eb;
+        --rule: #e5e7eb;
+      }
+      @media (prefers-color-scheme: dark) {
+        :root {
+          --bg: #0f1115;
+          --text: #e7e9ee;
+          --accent: #6ea8fe;
+          --rule: #242832;
+        }
+      }
+      * {
+        box-sizing: border-box;
+      }
+      body {
+        margin: 0;
+        background: var(--bg);
+        color: var(--text);
+        font: 16px/1.6 system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
+      }
+      main {
+        max-width: 760px;
+        margin: 0 auto;
+        padding: 24px 20px 64px;
+      }
+      a {
+        color: var(--accent);
+      }
+      .back {
+        display: inline-block;
+        margin-bottom: 20px;
+        text-decoration: none;
+      }
+      h1 {
+        font-size: 1.6rem;
+        text-align: center;
+      }
+      h2 {
+        font-size: 1.2rem;
+        margin-top: 2em;
+        padding-top: 1em;
+        border-top: 1px solid var(--rule);
+      }
+      h3 {
+        font-size: 1.05rem;
+        margin-top: 1.5em;
+      }
+      ul {
+        padding-left: 1.25em;
+      }
+      li {
+        margin: 0.25em 0;
+      }
+    </style>
+  </head>
+  <body>
+    <main>
+      <a class="back" href="/">← На главную</a>
+      ${body}
+    </main>
+  </body>
+</html>
+`;
+}