This commit is contained in:
2026-02-02 19:18:25 +03:00
commit 038b307d70
21 changed files with 4987 additions and 0 deletions

210
templates/index.html Normal file
View File

@@ -0,0 +1,210 @@
{% extends "base.html" %}
{% block title %}Капитал & Рынок - Экономическая стратегия{% endblock %}
{% block content %}
<div class="screen active">
<!-- Шапка -->
<div class="header">
<div class="logo-container">
{% if url_for('static', filename='images/logo.png') %}
<img src="{{ url_for('static', filename='images/logo.png') }}" alt="Капитал & Рынок" class="logo"
onerror="this.style.display='none'; this.nextElementSibling.style.display='block';">
<span class="logo-text" style="display: none; color: white; font-weight: bold; font-size: 1.2rem;">💰 Капитал & Рынок</span>
{% else %}
<span class="logo-text" style="color: white; font-weight: bold; font-size: 1.2rem;">💰 Капитал & Рынок</span>
{% endif %}
</div>
</div>
<!-- Основной контент -->
<div class="container">
<!-- Приветственная карточка -->
<div class="card text-center">
<h1 style="margin-bottom: 15px;">Капитал & Рынок</h1>
<p style="margin: 15px 0; font-size: 1.1rem; color: var(--light-text);">
Стань успешным инвестором в динамичной экономической стратегии!
</p>
<div style="margin: 25px 0;">
<div style="font-size: 4rem; margin-bottom: 20px;">💰📈🏦</div>
</div>
<div class="flex flex-col gap-3" style="max-width: 300px; margin: 0 auto;">
<a href="{{ url_for('login') }}" class="button" style="font-size: 1.1rem; padding: 15px;">
Войти в игру
</a>
<a href="{{ url_for('register') }}" class="button success" style="font-size: 1.1rem; padding: 15px;">
Создать аккаунт
</a>
<a href="{{ url_for('quick_login', username='Гость') }}" class="button secondary" style="padding: 12px;">
Быстрый старт (гостевая игра)
</a>
</div>
</div>
<!-- Особенности игры -->
<div class="card">
<h3 style="text-align: center; margin-bottom: 20px;">Особенности игры</h3>
<div style="display: grid; grid-template-columns: 1fr; gap: 15px;">
<div style="display: flex; align-items: flex-start; gap: 15px; padding: 15px; background-color: #f8f9fa; border-radius: var(--border-radius);">
<div style="font-size: 2rem; flex-shrink: 0;">🎮</div>
<div>
<h4 style="margin-bottom: 5px;">Динамичный геймплей</h4>
<p style="font-size: 0.9rem; color: var(--light-text); margin: 0;">
Каждый месяц - новые решения, события и вызовы. Адаптируйтесь к меняющемуся рынку!
</p>
</div>
</div>
<div style="display: flex; align-items: flex-start; gap: 15px; padding: 15px; background-color: #f8f9fa; border-radius: var(--border-radius);">
<div style="font-size: 2rem; flex-shrink: 0;">👥</div>
<div>
<h4 style="margin-bottom: 5px;">Мультиплеер до 10 игроков</h4>
<p style="font-size: 0.9rem; color: var(--light-text); margin: 0;">
Соревнуйтесь с друзьями или случайными соперниками. Создавайте альянсы и заключайте сделки!
</p>
</div>
</div>
<div style="display: flex; align-items: flex-start; gap: 15px; padding: 15px; background-color: #f8f9fa; border-radius: var(--border-radius);">
<div style="font-size: 2rem; flex-shrink: 0;">💡</div>
<div>
<h4 style="margin-bottom: 5px;">13 уникальных способностей</h4>
<p style="font-size: 0.9rem; color: var(--light-text); margin: 0;">
Каждый игрок получает особую способность: от Кризисного инвестора до Теневого бухгалтера.
</p>
</div>
</div>
<div style="display: flex; align-items: flex-start; gap: 15px; padding: 15px; background-color: #f8f9fa; border-radius: var(--border-radius);">
<div style="font-size: 2rem; flex-shrink: 0;">📊</div>
<div>
<h4 style="margin-bottom: 5px;">Реалистичная экономика</h4>
<p style="font-size: 0.9rem; color: var(--light-text); margin: 0;">
Рынок реагирует на действия всех игроков. Ваши решения влияют на цены активов!
</p>
</div>
</div>
</div>
</div>
<!-- Как начать играть -->
<div class="card">
<h3 style="text-align: center; margin-bottom: 20px;">Как начать играть?</h3>
<div style="counter-reset: step-counter;">
<div style="display: flex; align-items: flex-start; gap: 15px; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #eee;">
<div style="background-color: var(--primary-color); color: white; width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-weight: bold;">
1
</div>
<div>
<h4 style="margin-bottom: 5px;">Создайте аккаунт</h4>
<p style="font-size: 0.95rem; color: var(--light-text); margin: 0;">
Зарегистрируйтесь или войдите как гость. Это займет менее минуты!
</p>
</div>
</div>
<div style="display: flex; align-items: flex-start; gap: 15px; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #eee;">
<div style="background-color: var(--primary-color); color: white; width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-weight: bold;">
2
</div>
<div>
<h4 style="margin-bottom: 5px;">Присоединитесь к комнате</h4>
<p style="font-size: 0.95rem; color: var(--light-text); margin: 0;">
Выберите существующую комнату или создайте свою. Настройте правила игры.
</p>
</div>
</div>
<div style="display: flex; align-items: flex-start; gap: 15px; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #eee;">
<div style="background-color: var(--primary-color); color: white; width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-weight: bold;">
3
</div>
<div>
<h4 style="margin-bottom: 5px;">Выберите способность</h4>
<p style="font-size: 0.95rem; color: var(--light-text); margin: 0;">
Получите случайную уникальную способность и стартовый капитал 100,000 ₽.
</p>
</div>
</div>
<div style="display: flex; align-items: flex-start; gap: 15px;">
<div style="background-color: var(--primary-color); color: white; width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-weight: bold;">
4
</div>
<div>
<h4 style="margin-bottom: 5px;">Станьте самым богатым!</h4>
<p style="font-size: 0.95rem; color: var(--light-text); margin: 0;">
Инвестируйте в акции, недвижимость, бизнес. Обыграйте конкурентов за 12 месяцев!
</p>
</div>
</div>
</div>
</div>
<!-- Статистика (заглушка) -->
<div class="card text-center">
<h3 style="margin-bottom: 15px;">Игровая статистика</h3>
<div style="display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin-top: 20px;">
<div style="padding: 15px; background-color: #f0f8ff; border-radius: var(--border-radius);">
<div style="font-size: 2rem; font-weight: bold; color: var(--primary-color);">1,234</div>
<div style="font-size: 0.9rem; color: var(--light-text);">Активных игроков</div>
</div>
<div style="padding: 15px; background-color: #f0f8ff; border-radius: var(--border-radius);">
<div style="font-size: 2rem; font-weight: bold; color: var(--primary-color);">567</div>
<div style="font-size: 0.9rem; color: var(--light-text);">Игровых комнат</div>
</div>
<div style="padding: 15px; background-color: #f0f8ff; border-radius: var(--border-radius);">
<div style="font-size: 2rem; font-weight: bold; color: var(--primary-color);">89</div>
<div style="font-size: 0.9rem; color: var(--light-text);">Турниров</div>
</div>
<div style="padding: 15px; background-color: #f0f8ff; border-radius: var(--border-radius);">
<div style="font-size: 2rem; font-weight: bold; color: var(--primary-color);">12</div>
<div style="font-size: 0.9rem; color: var(--light-text);">Уникальных способностей</div>
</div>
</div>
</div>
<!-- Футер -->
<div style="text-align: center; padding: 20px 0; color: var(--light-text); font-size: 0.9rem;">
<p>© 2024 Капитал & Рынок. Экономическая стратегия в реальном времени.</p>
<p style="margin-top: 10px;">
<a href="#" style="color: var(--primary-color); text-decoration: none; margin: 0 10px;">Правила</a> |
<a href="#" style="color: var(--primary-color); text-decoration: none; margin: 0 10px;">Контакты</a> |
<a href="#" style="color: var(--primary-color); text-decoration: none; margin: 0 10px;">Поддержка</a>
</p>
</div>
</div>
</div>
{% endblock %}
{% block scripts %}
<script>
// Простая анимация для привлечения внимания
document.addEventListener('DOMContentLoaded', function() {
const emojis = document.querySelector('.text-center .flex');
if (emojis) {
emojis.style.opacity = '0';
emojis.style.transform = 'translateY(20px)';
setTimeout(() => {
emojis.style.transition = 'opacity 0.5s ease, transform 0.5s ease';
emojis.style.opacity = '1';
emojis.style.transform = 'translateY(0)';
}, 300);
}
// Подсветка кнопок при наведении
const buttons = document.querySelectorAll('.button');
buttons.forEach(button => {
button.addEventListener('mouseenter', function() {
this.style.transform = 'translateY(-2px)';
});
button.addEventListener('mouseleave', function() {
this.style.transform = 'translateY(0)';
});
});
});
</script>
{% endblock %}