Andreas/mtg_python_deckbuilder
1
0
Fork 0
mirror of https://github.com/mwisnowski/mtg_python_deckbuilder.git synced 2025-12-21 10:00:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

overhaul: migrated to tailwind css for css management, consolidated custom css, removed inline css, removed unneeded css, and otherwise improved page styling

Browse source
This commit is contained in:
matt 2025-10-28 08:21:52 -07:00
parent f1e21873e7
commit b994978f60
81 changed files with 15784 additions and 2936 deletions
Download patch file Download diff file Expand all files Collapse all files

9
code/web/templates/browse/cards/_card_tile.html
View file

@ -1,13 +1,18 @@
{# Single card tile for grid display #}
<div class="card-browser-tile card-tile" data-card-name="{{ card.name }}" data-tags="{{ card.themeTags_parsed|join(', ') if card.themeTags_parsed else '' }}">
<div class="card-browser-tile card-tile"
data-card-name="{{ card.name }}"
data-tags="{{ card.themeTags_parsed|join(', ') if card.themeTags_parsed else '' }}"
{% if card.layout %}data-layout="{{ card.layout }}"{% endif %}>
{# Card image (uses hover system for preview) #}
<div class="card-browser-tile-image">
<img
loading="lazy"
decoding="async"
alt="{{ card.name }}"
src="https://api.scryfall.com/cards/named?fuzzy={{ card.name|urlencode }}&format=image&version=normal"
src="{{ card.name|card_image('normal') }}"
onerror="this.style.display='none'; this.nextElementSibling.style.display='flex';"
data-card-name="{{ card.name }}"
{% if card.layout %}data-layout="{{ card.layout }}"{% endif %}
/>
{# Fallback for missing images #}
<div style="display:none; width:100%; height:100%; align-items:center; justify-content:center; background:#1a1d24; color:#9ca3af; font-size:14px; padding:1rem; text-align:center; position:absolute; top:0; left:0;">

2
code/web/templates/browse/cards/_similar_cards.html
View file

@ -235,7 +235,7 @@
<div class="similar-card-tile card-tile" data-card-name="{{ card.name }}">
<!-- Card Image (uses hover system for preview) -->
<div class="similar-card-image">
<img src="https://api.scryfall.com/cards/named?fuzzy={{ card.name|urlencode }}&format=image&version=normal"
<img src="{{ card.name|card_image('normal') }}"
alt="{{ card.name }}"
loading="lazy"
data-card-name="{{ card.name }}"

2
code/web/templates/browse/cards/detail.html
View file

@ -193,7 +193,7 @@
<div class="card-detail-header">
<!-- Card Image (no hover on detail page) -->
<div class="card-image-large">
<img src="https://api.scryfall.com/cards/named?fuzzy={{ card.name|urlencode }}&format=image&version=normal"
<img src="{{ card.name|card_image('normal') }}"
alt="{{ card.name }}"
loading="lazy"
onerror="this.style.display='none'; this.nextElementSibling.style.display='flex';">