Add javascript marquee effect for overflowing text on card badge names

This commit is contained in:
badblocks 2025-04-06 23:30:57 -07:00
parent 262f0ea190
commit e37731b74d
7 changed files with 47 additions and 48 deletions

View file

@ -92,48 +92,15 @@
<h5 class="text-xl font-semibold whitespace-nowrap truncate mb-0">Featured Offers</h5>
</div>
<div class="p-4">
<!-- Tab contents -->
<div id="featured-tab-contents">
<div class="tab-content" data-tab="featured-all">
{% if featured_offers.All %}
<div class="flex flex-col items-center gap-6 w-auto mx-auto">
{% for offer in featured_offers.All %}
{% render_trade_offer offer %}
{% endfor %}
</div>
{% else %}
<p class="text-center">No featured offers available.</p>
{% endif %}
</div>
{% for rarity, offers in featured_offers.items %}
{% if rarity != "All" %}
<div class="tab-content" data-tab="featured-{{ forloop.counter }}" style="display: none;">
{% if offers %}
<div class="flex flex-col items-center gap-3 w-auto mx-auto">
{% for offer in offers %}
{% render_trade_offer offer %}
{% endfor %}
</div>
{% else %}
<p class="text-center">No featured offers for {{ rarity }}.</p>
{% endif %}
</div>
{% endif %}
{% endfor %}
</div>
<!-- DaisyUI Tabs for Featured Offers (hidden for now) -->
<div class="card card-border bg-base-100 shadow-lg w-96 md:w-80 lg:w-96 mt-8 mx-auto hidden">
<!-- Tabs navigation using daisyUI tabs-box -->
<div class="tabs tabs-box bg-white dark:bg-base-100 grid grid-cols-3 gap-1.5 justify-items-stretch">
<!-- Radio inputs for controlling tab state -->
<input type="radio" class="tab text-xs font-bold md:text-sm w-full bg-base-100" name="featured_tabs" id="featured-all" checked="checked" aria-label="All">
{% for rarity, offers in featured_offers.items %}
{% if rarity != "All" %}
<input type="radio" class="tab text-xs font-bold md:text-sm w-full bg-base-100" name="featured_tabs" id="featured-{{ forloop.counter }}" aria-label="{{ rarity }}">
{% endif %}
{% if featured_offers.All %}
<div class="flex flex-col items-center gap-6 w-auto mx-auto">
{% for offer in featured_offers.All %}
{% render_trade_offer offer %}
{% endfor %}
</div>
</div>
{% else %}
<p class="text-center">No featured offers available.</p>
{% endif %}
</div>
{% endcache %}
</div>