game kit page: four 6×3 applets (trinkets, tokens, card decks, dice sets) with applet grid; tarot fan modal with coverflow, sessionStorage position memory, and 403 guard on locked decks; unlocked_decks M2M on User with backfill migration; game kit icon wrap fix; tarot_deck.html moved to gameboard/ per template dir convention (now documented in CLAUDE.md); FTs 6–13, 2 new ITs; 360 passing [log Co-Authored-By: Claude Sonnet 4.6]
This commit is contained in:
98
src/templates/apps/gameboard/game_kit.html
Normal file
98
src/templates/apps/gameboard/game_kit.html
Normal file
@@ -0,0 +1,98 @@
|
||||
{% extends "core/base.html" %}
|
||||
{% load static %}
|
||||
|
||||
{% block title_text %}Game Kit{% endblock title_text %}
|
||||
{% block header_text %}<span>Game</span>Kit{% endblock header_text %}
|
||||
|
||||
{% block content %}
|
||||
<div class="gameboard-page">
|
||||
<div id="id_game_kit_applets_container">
|
||||
|
||||
<section id="id_gk_trinkets" style="--applet-cols: 6; --applet-rows: 3;">
|
||||
<h2>Trinkets</h2>
|
||||
<div class="gk-items">
|
||||
{% if pass_token %}
|
||||
<div class="gk-trinket-card" data-token-id="{{ pass_token.pk }}">
|
||||
<i class="fa-solid fa-clipboard"></i>
|
||||
<span>{{ pass_token.tooltip_name }}</span>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if carte %}
|
||||
<div class="gk-trinket-card" data-token-id="{{ carte.pk }}">
|
||||
<i class="fa-solid fa-money-check"></i>
|
||||
<span>{{ carte.tooltip_name }}</span>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if coin %}
|
||||
<div class="gk-trinket-card" data-token-id="{{ coin.pk }}">
|
||||
<i class="fa-solid fa-medal"></i>
|
||||
<span>{{ coin.tooltip_name }}</span>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if not pass_token and not carte and not coin %}
|
||||
<p class="gk-empty"><em>No trinkets yet.</em></p>
|
||||
{% endif %}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="id_gk_tokens" style="--applet-cols: 6; --applet-rows: 3;">
|
||||
<h2>Tokens</h2>
|
||||
<div class="gk-items">
|
||||
{% for token in free_tokens %}
|
||||
<div class="gk-token-card" data-token-id="{{ token.pk }}">
|
||||
<i class="fa-solid fa-coins"></i>
|
||||
<span>{{ token.tooltip_name }}</span>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% for token in tithe_tokens %}
|
||||
<div class="gk-token-card" data-token-id="{{ token.pk }}">
|
||||
<i class="fa-solid fa-hand-holding-dollar"></i>
|
||||
<span>{{ token.tooltip_name }}</span>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% if not free_tokens and not tithe_tokens %}
|
||||
<p class="gk-empty"><em>No tokens yet.</em></p>
|
||||
{% endif %}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="id_gk_decks" style="--applet-cols: 6; --applet-rows: 3;">
|
||||
<h2>Card Decks</h2>
|
||||
<div class="gk-items">
|
||||
{% for deck in unlocked_decks %}
|
||||
<div class="gk-deck-card" data-deck-id="{{ deck.pk }}">
|
||||
<i class="fa-regular fa-id-badge"></i>
|
||||
<span>{{ deck.name }}</span>
|
||||
<small>{{ deck.card_count }} cards</small>
|
||||
</div>
|
||||
{% empty %}
|
||||
<p class="gk-empty"><em>No decks unlocked.</em></p>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="id_gk_dice" style="--applet-cols: 6; --applet-rows: 3;">
|
||||
<h2>Dice Sets</h2>
|
||||
<div class="gk-items">
|
||||
<div class="gk-placeholder">
|
||||
<i class="fa-solid fa-dice"></i>
|
||||
<span>Coming soon</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<dialog id="id_tarot_fan_dialog">
|
||||
<div class="tarot-fan-wrap">
|
||||
<button id="id_fan_prev" class="fan-nav fan-nav--prev" aria-label="Previous card">‹</button>
|
||||
<div id="id_fan_content" class="tarot-fan"></div>
|
||||
<button id="id_fan_next" class="fan-nav fan-nav--next" aria-label="Next card">›</button>
|
||||
</div>
|
||||
</dialog>
|
||||
{% endblock content %}
|
||||
|
||||
{% block scripts %}
|
||||
<script src="{% static 'apps/gameboard/game-kit.js' %}"></script>
|
||||
{% endblock scripts %}
|
||||
Reference in New Issue
Block a user