{% extends "core/base.html" %}

{% block content %}
    <div class="gameboard-page">
        <section id="id_applet_my_games">
            <h2>My Games</h2>
        </section>

        <section id="id_applet_new_game">
            <h2>New Game</h2>
        </section>

        <div id="id_game_gear"></div>
        <button
            id="id_game_kit_btn"
            onclick="document.getElementById('id_game_kit').style.display='block'"
        >
            Game Kit
        </button>
        <div id="id_game_kit" style="display:none;">
            {% if coin %}
                <div id="id_kit_coin_on_a_string" class="token">
                    <span class="token-tooltip">{{ coin.tooltip_text }}</span>
                </div>
            {% endif %}
            {% for token in free_tokens %}
                <div id="id_kit_free_token_{{ forloop.counter0 }}" class="token">
                    <span class="token-tooltip">{{ token.tooltip_text }}</span>
                </div>
            {% endfor %}
            <div id="id_kit_card_deck" class="kit-item">Card Deck</div>
            <div id="id_kit_dice_set" class="kit-item">Dice Set</div>
        </div>
    </div>
{% endblock content %}