перевод лендинга на vue, добавление поддержки inertia

2026-06-27 22:15:17 +04:00
parent d72650bbdc
commit 8bf1b852f0
25 changed files with 1451 additions and 162 deletions
@@ -0,0 +1,46 @@
+<script setup>
+import { arrowSvg, moonMark } from './symbols';
+
+defineProps({ playUrl: { type: String, required: true } });
+</script>
+
+<template>
+    <footer class="footer" data-screen-label="05 Footer">
+        <div class="wrap">
+            <div class="footer-cta reveal">
+                <span class="eyebrow">Свет лунного колодца зовет</span>
+                <div style="height: 20px"></div>
+                <h2 class="h-display">Один лаунчер - и ты у ворот Тельдрассила.</h2>
+                <p>Наш лаунчер сам поставит игровой клиент, пропишет realmlist и будет держать все в актуальном состоянии. Без ручных патчей и копирования файлов.</p>
+                <div class="launcher-steps">
+                    <div class="launcher-step"><span class="n">01</span><span class="t">Скачай лаунчер</span></div>
+                    <div class="launcher-step"><span class="n">02</span><span class="t">Войди или создай аккаунт</span></div>
+                    <div class="launcher-step"><span class="n">03</span><span class="t">Нажми «Играть» - остальное автоматически</span></div>
+                </div>
+                <div class="hero-cta" style="justify-content: center; margin-top: 40px">
+                    <a :href="playUrl" class="btn btn-primary">Скачать лаунчер для Windows <span v-html="arrowSvg"></span></a>
+                    <a href="#" class="btn btn-ghost is-disabled" aria-disabled="true">macOS - в разработке</a>
+                </div>
+                <div style="margin-top: 20px; font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.18em; color: var(--text-mute); text-transform: uppercase">v 1.4.2 · ~180 MB · автообновление</div>
+            </div>
+
+            <div class="footer-grid">
+                <div class="footer-col footer-brand">
+                    <div style="display: flex; align-items: center; gap: 12px; color: var(--moon)">
+                        <span v-html="moonMark(28)"></span>
+                        <span style="font-family: var(--f-display); letter-spacing: 0.18em; font-size: 16px; color: var(--ivory)">MOONWELL</span>
+                    </div>
+                    <p>Приватный сервер World of Warcraft 3.3.5a с индивидуальным прогрессом, соло-данжами и режимом «Предатель». Бесплатно и без pay-to-win.</p>
+                </div>
+                <div class="footer-col"><h4>Сервер</h4><a href="#">Статус реалмов</a><a href="#">Скачать клиент</a><a href="#">Правила</a><a href="#">Дорожная карта</a></div>
+                <div class="footer-col"><h4>Сообщество</h4><a href="#">Discord</a><a href="#">Форум</a><a href="#">Поддержка</a><a href="#">Вакансии</a></div>
+                <div class="footer-col"><h4>База знаний</h4><a href="#">Гайды</a><a href="#">База данных</a><a href="#">Рейтинги</a><a href="#">API</a></div>
+            </div>
+
+            <div class="footer-bottom">
+                <span>© 2026 MoonWell · fan project · не связан с Blizzard Entertainment</span>
+                <span>Сделано с лунным светом</span>
+            </div>
+        </div>
+    </footer>
+</template>