discoman/python-tdd
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

tooltips app TDD spike + kit bag refactor to .tt

Browse Source 
- New apps.tooltips: TooltipContent model, {% tooltip data %} inclusion
  tag, _tooltip.html partial with .tt/.tt-title/.tt-description etc.
  class contract; 34 tests green
- Kit bag panel (_kit_bag_panel.html): .token-tooltip → .tt + child
  class renames (tt-title, tt-description, tt-shoptalk, tt-expiry)
- game-kit.js attachTooltip: .token-tooltip → .tt selector
- SCSS: .tt added alongside .token-tooltip for display:none default +
  hover rules in _wallet-tokens.scss and _game-kit.scss

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Disco DeDisco
2026-04-15 22:16:50 -04:00
parent 71ef3dcb7f
commit de4ac60aec
20 changed files with 520 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
src/templates/apps/tooltips/_tooltip.html Normal file
View File

@@ -0,0 +1,69 @@
<div class="tt">
<h4 class="tt-title">{{ title }}</h4>
{% if type_label %}<p class="tt-type">{{ type_label }}</p>{% endif %}
{% if symbol %}<span class="tt-symbol">{{ symbol }}</span>{% endif %}
{% if degree_str %}<p class="tt-degree">{{ degree_str }}</p>{% endif %}
{% if description %}<p class="tt-description">{{ description }}</p>{% endif %}
{% if shoptalk %}<p class="tt-shoptalk"><em>{{ shoptalk }}</em></p>{% endif %}
{% if expiry %}<p class="tt-expiry">{{ expiry }}</p>{% endif %}
{% if effect %}<p class="tt-effect">{{ effect }}</p>{% endif %}
{% if dignities %}
<table class="tt-table tt-table--dignities">
{% for key, value in dignities.items %}
<tr><th>{{ key }}</th><td>{{ value }}</td></tr>
{% endfor %}
</table>
{% endif %}
{% if aspects %}
<ul class="tt-aspects">
{% for asp in aspects %}
<li><span class="tt-asp-symbol">{{ asp.symbol }}</span> {{ asp.type }} {{ asp.body }} <span class="tt-asp-orb">{{ asp.orb }}</span></li>
{% endfor %}
</ul>
{% endif %}
{% if keywords_up or keywords_rev %}
<div class="tt-keywords">
{% if keywords_up %}
<ul class="tt-keywords-up">
{% for kw in keywords_up %}<li>{{ kw }}</li>{% endfor %}
</ul>
{% endif %}
{% if keywords_rev %}
<ul class="tt-keywords-rev">
{% for kw in keywords_rev %}<li>{{ kw }}</li>{% endfor %}
</ul>
{% endif %}
</div>
{% endif %}
{% if cautions %}
<div class="tt-fyi tt-fyi--cautions">
{% for caution in cautions %}
<div class="tt-fyi-item">
{% if caution.type_label %}<p class="tt-fyi-type">{{ caution.type_label }}</p>{% endif %}
{% if caution.shoptalk %}<p class="tt-fyi-shoptalk">{{ caution.shoptalk }}</p>{% endif %}
{% if caution.effect %}<p class="tt-fyi-effect">{{ caution.effect }}</p>{% endif %}
</div>
{% endfor %}
</div>
{% endif %}
{% if nav %}
<div class="tt-nav">
<span class="tt-nav-prv">{{ nav.prv }}</span>
<span class="tt-nav-nxt">{{ nav.nxt }}</span>
</div>
{% endif %}
</div>

40
src/templates/core/_partials/_kit_bag_panel.html
View File

@@ -4,12 +4,12 @@
<div class="kit-bag-row">
<div class="kit-bag-deck" data-deck-id="{{ equipped_deck.pk }}">
<i class="fa-regular fa-id-badge"></i>
<div class="token-tooltip">
<h4>{{ equipped_deck.name }}{% if equipped_deck.is_default %} <span class="token-count">(Default)</span>{% endif %}</h4>
<p>{{ equipped_deck.card_count }}-card Tarot deck</p>
<small><em>placeholder comment</em></small>
<p class="availability">active</p>
<p class="stock-version">Stock version</p>
<div class="tt">
<h4 class="tt-title">{{ equipped_deck.name }}{% if equipped_deck.is_default %} <span class="token-count">(Default)</span>{% endif %}</h4>
<p class="tt-description">{{ equipped_deck.card_count }}-card Tarot deck</p>
<p class="tt-shoptalk"><em>placeholder comment</em></p>
<p class="tt-effect">active</p>
<p class="tt-expiry">Stock version</p>
</div>
</div>
</div>
@@ -43,13 +43,13 @@
{% else %}
<i class="fa-solid fa-clipboard"></i>
{% endif %}
<div class="token-tooltip">
<h4>{{ token.tooltip_name }}</h4>
<p>{{ token.tooltip_description }}</p>
<div class="tt">
<h4 class="tt-title">{{ token.tooltip_name }}</h4>
<p class="tt-description">{{ token.tooltip_description }}</p>
{% if token.tooltip_shoptalk %}
<small><em>{{ token.tooltip_shoptalk }}</em></small>
<p class="tt-shoptalk"><em>{{ token.tooltip_shoptalk }}</em></p>
{% endif %}
<p class="expiry">{{ token.tooltip_expiry }}</p>
<p class="tt-expiry">{{ token.tooltip_expiry }}</p>
{% with room_html=token.tooltip_room_html %}
{% if room_html %}{{ room_html|safe }}{% endif %}
{% endwith %}
@@ -72,13 +72,13 @@
data-token-type="{{ free_token.token_type }}"
>
<i class="fa-solid fa-coins"></i>
<div class="token-tooltip">
<h4>{{ free_token.tooltip_name }}{% if free_count > 1 %} <span class="token-count">(×{{ free_count }})</span>{% endif %}</h4>
<p>{{ free_token.tooltip_description }}</p>
<div class="tt">
<h4 class="tt-title">{{ free_token.tooltip_name }}{% if free_count > 1 %} <span class="token-count">(×{{ free_count }})</span>{% endif %}</h4>
<p class="tt-description">{{ free_token.tooltip_description }}</p>
{% if free_token.tooltip_shoptalk %}
<small><em>{{ free_token.tooltip_shoptalk }}</em></small>
<p class="tt-shoptalk"><em>{{ free_token.tooltip_shoptalk }}</em></p>
{% endif %}
<p class="expiry">{{ free_token.tooltip_expiry }}</p>
<p class="tt-expiry">{{ free_token.tooltip_expiry }}</p>
</div>
</div>
{% endif %}
@@ -90,10 +90,10 @@
data-token-type="{{ tithe_token.token_type }}"
>
<i class="fa-solid fa-piggy-bank"></i>
<div class="token-tooltip">
<h4>{{ tithe_token.tooltip_name }}{% if tithe_count > 1 %} <span class="token-count">(×{{ tithe_count }})</span>{% endif %}</h4>
<p>{{ tithe_token.tooltip_description }}</p>
<p class="expiry">{{ tithe_token.tooltip_expiry }}</p>
<div class="tt">
<h4 class="tt-title">{{ tithe_token.tooltip_name }}{% if tithe_count > 1 %} <span class="token-count">(×{{ tithe_count }})</span>{% endif %}</h4>
<p class="tt-description">{{ tithe_token.tooltip_description }}</p>
<p class="tt-expiry">{{ tithe_token.tooltip_expiry }}</p>
</div>
</div>
{% endif %}