{% extends "base.html" %}
{% block background %}{{ url_for('static', filename='images/default.jpg') }}{% endblock %}
{% block content %}
    <header>
        <p>Welcome to the</p>
        <h1>DV8 Game Expo <span data-text="2023">2023</span>!</h1>
        <i class="ph-bold ph-caret-double-down"></i>
    </header>

    <section id="What_is_this?">
        <h2>What is this?</h2>
        <p>The DV8 Game Expo, is a showcase of the works and efforts of students from the past year. This includes Level 3 year 1 and year 2.</p>
    </section>

    <section id="Student_Games">
        <h2>Student Games</h2>
        <p>Here are some games AAAA</p>

        <div class="games">
            {% for game in games %}
                <a class="game-box" href="{{ url_for('website.g', game_id=game.id) }}">
                    {% if game.background %}
                        <img src="{{ url_for('static', filename='images/backgrounds/' + game.background) }}" alt="{{ game.name }}" class="background">
                    {% else %}
                        <img src="{{ url_for('static', filename='images/default.jpg') }}" alt="{{ game.name }}" class="background">
                    {% endif %}
                    <div>
                        {% if game.logo %}
                            <img src="{{ url_for('static', filename='images/logos/' + game.logo) }}" alt="{{ game.name }}" class="logo">
                        {% else %}
                            <h2>{{ game.name }}</h2>
                        {% endif %}
                        <p>{{ game.studio }}</p>
                        <!-- <p>{{ game.description|truncate(100) }}</p> -->

                        <span><!-- Seperator --></span>

                        <ul>
                            {% for tag in game.tags %}
                                <li>{{ tag.tag }}</li>
                            {% endfor %}
                        </ul>
                    </div>
                </a>
            {% endfor %}
        </div>
    </section>
{% endblock %}