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

TOOLTIPS: game kit applet refactor — .token-tooltip → .tt + double-tooltip fix

Browse Source 
- _applet-game-kit.html: all 5 token blocks use .tt + child classes (.tt-title,
  .tt-description, .tt-shoptalk, .tt-expiry); removed .token-tooltip-body wrapper
- gameboard.js: 4× querySelector('.token-tooltip') → querySelector('.tt')
- _gameboard.scss: extend hover suppressor to .tt so CSS hover doesn't show inline
  .tt when JS portal is active (fixed double tooltip visual bug)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Disco DeDisco
2026-04-15 22:39:01 -04:00
parent de4ac60aec
commit 10a6809dcf
3 changed files with 37 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
src/templates/apps/gameboard/_partials/_applet-game-kit.html
View File

@@ -7,45 +7,39 @@
{% if pass_token %}
<div id="id_kit_pass" class="token" data-token-id="{{ pass_token.pk }}">
<i class="fa-solid fa-clipboard"></i>
<div class="token-tooltip">
<div class="token-tooltip-body">
<h4>{{ pass_token.tooltip_name }}</h4>
<p>{{ pass_token.tooltip_description }}</p>
{% if pass_token.tooltip_shoptalk %}
<small><em>{{ pass_token.tooltip_shoptalk }}</em></small>
{% endif %}
<p class="expiry">{{ pass_token.tooltip_expiry }}</p>
</div>
<div class="tt">
<h4 class="tt-title">{{ pass_token.tooltip_name }}</h4>
<p class="tt-description">{{ pass_token.tooltip_description }}</p>
{% if pass_token.tooltip_shoptalk %}
<p class="tt-shoptalk"><em>{{ pass_token.tooltip_shoptalk }}</em></p>
{% endif %}
<p class="tt-expiry">{{ pass_token.tooltip_expiry }}</p>
</div>
</div>
{% endif %}
{% if carte %}
<div id="id_kit_carte_blanche" class="token" data-token-id="{{ carte.pk }}">
<i class="fa-solid fa-money-check"></i>
<div class="token-tooltip">
<div class="token-tooltip-body">
<h4>{{ carte.tooltip_name }}</h4>
<p>{{ carte.tooltip_description }}</p>
{% if carte.tooltip_shoptalk %}
<small><em>{{ carte.tooltip_shoptalk }}</em></small>
{% endif %}
<p class="expiry">{{ carte.tooltip_expiry }}</p>
</div>
<div class="tt">
<h4 class="tt-title">{{ carte.tooltip_name }}</h4>
<p class="tt-description">{{ carte.tooltip_description }}</p>
{% if carte.tooltip_shoptalk %}
<p class="tt-shoptalk"><em>{{ carte.tooltip_shoptalk }}</em></p>
{% endif %}
<p class="tt-expiry">{{ carte.tooltip_expiry }}</p>
</div>
</div>
{% endif %}
{% if coin %}
<div id="id_kit_coin_on_a_string" class="token" data-token-id="{{ coin.pk }}">
<i class="fa-solid fa-medal"></i>
<div class="token-tooltip">
<div class="token-tooltip-body">
<h4>{{ coin.tooltip_name }}</h4>
<p>{{ coin.tooltip_description }}</p>
{% if coin.tooltip_shoptalk %}
<small><em>{{ coin.tooltip_shoptalk }}</em></small>
{% endif %}
<p class="expiry">{{ coin.tooltip_expiry }}</p>
</div>
<div class="tt">
<h4 class="tt-title">{{ coin.tooltip_name }}</h4>
<p class="tt-description">{{ coin.tooltip_description }}</p>
{% if coin.tooltip_shoptalk %}
<p class="tt-shoptalk"><em>{{ coin.tooltip_shoptalk }}</em></p>
{% endif %}
<p class="tt-expiry">{{ coin.tooltip_expiry }}</p>
</div>
</div>
{% endif %}
@@ -53,15 +47,13 @@
{% with free_tokens.0 as token %}
<div id="id_kit_free_token" class="token">
<i class="fa-solid fa-coins"></i>
<div class="token-tooltip">
<div class="token-tooltip-body">
<h4>{{ token.tooltip_name }}{% if free_count > 1 %} <span class="token-count">(×{{ free_count }})</span>{% endif %}</h4>
<p>{{ token.tooltip_description }}</p>
{% if token.tooltip_shoptalk %}
<small><em>{{ token.tooltip_shoptalk }}</em></small>
{% endif %}
<p class="expiry">{{ token.tooltip_expiry }}</p>
</div>
<div class="tt">
<h4 class="tt-title">{{ token.tooltip_name }}{% if free_count > 1 %} <span class="token-count">(×{{ free_count }})</span>{% endif %}</h4>
<p class="tt-description">{{ token.tooltip_description }}</p>
{% if token.tooltip_shoptalk %}
<p class="tt-shoptalk"><em>{{ token.tooltip_shoptalk }}</em></p>
{% endif %}
<p class="tt-expiry">{{ token.tooltip_expiry }}</p>
</div>
</div>
{% endwith %}
@@ -69,11 +61,9 @@
{% for deck in deck_variants %}
<div id="id_kit_{{ deck.short_key }}_deck" class="token deck-variant" data-deck-id="{{ deck.pk }}">
<i class="fa-regular fa-id-badge"></i>
<div class="token-tooltip">
<div class="token-tooltip-body">
<h4>{{ deck.name }}</h4>
<p>{{ deck.card_count }} cards</p>
</div>
<div class="tt">
<h4 class="tt-title">{{ deck.name }}</h4>
<p class="tt-description">{{ deck.card_count }} cards</p>
</div>
</div>
{% empty %}