Reduce size of card badges, and change trade offers to show all cards by default, but in minimized mode. expand button now toggles between minimized mode and expanded mode for all cards on the trade offer

theme/templates/cards/_card_list.html

@@ -3,19 +3,19 @@
 {% if group_by and groups %}
     {% for group in groups %}
         <div class="divider">{{ group.group }}</div>
-        <div class="flex justify-center flex-wrap gap-4">
+        <div class="flex justify-center flex-wrap">
             {% for card in group.cards %}
                 <a href="{% url 'cards:card_detail' card.pk %}">
-                    {% card_badge card "" %}
+                    {% card_badge card static=True %}
                 </a>
             {% endfor %}
         </div>
     {% endfor %}
 {% else %}
-    <div class="flex justify-center flex-wrap gap-4">
+    <div class="flex justify-center flex-wrap">
         {% for card in cards %}
             <a href="{% url 'cards:card_detail' card.pk %}">
-                {% card_badge card "" %}
+                {% card_badge card static=True %}
             </a>
         {% endfor %}
     </div>

theme/templates/cards/_trade_offer_list.html

@@ -1,10 +1,8 @@
 {% load trade_offer_tags %}
 {% if trade_offers %}
-  <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+  <div class="flex flex-row flex-wrap gap-1 justify-center items-start">
     {% for offer in trade_offers %}
-      <div class="mb-4">
-         {% render_trade_offer offer %}
-      </div>
+      {% render_trade_offer offer %}
     {% endfor %}
   </div>
 {% else %}

theme/templates/cards/card_detail.html

@@ -1,7 +1,6 @@
 {% extends "base.html" %}
 {% load static card_badge %}
 {% block content %}
-<div class="container mx-auto p-4">
     <!-- Card header with badge and details -->
     <div class="flex items-center mb-6">
         <div class="ml-4">
@@ -95,5 +94,4 @@
         </div>
         
     </div>
-</div>
 {% endblock %} 

theme/templates/cards/card_list.html

@@ -27,13 +27,13 @@
             <!-- Sort Dropdown -->
             <div class="dropdown dropdown-end m-1">
                 <div tabindex="0" class="btn">
-                    Sort by: <span x-text="order === 'absolute' ? 'None' : (order === 'alphabetical' ? 'Alphabetical' : 'Rarity')"></span>
+                    Sort by: <span x-text="order === 'absolute' ? 'Cardset' : (order === 'alphabetical' ? 'Alphabetical' : 'Rarity')"></span>
                     <svg class="size-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
                     </svg>
                 </div>
                 <ul tabindex="0" class="dropdown-content menu p-2 shadow bg-base-100 rounded-box w-52">
-                    <li><a href="#" @click.prevent="order = 'absolute'; page = 1; loadCards()">None</a></li>
+                    <li><a href="#" @click.prevent="order = 'absolute'; page = 1; loadCards()">Cardset</a></li>
                     <li><a href="#" @click.prevent="order = 'alphabetical'; page = 1; loadCards()">Alphabetical</a></li>
                     <li><a href="#" @click.prevent="order = 'rarity'; page = 1; loadCards()">Rarity</a></li>
                 </ul>

theme/templates/home/_card_list.html

@@ -1,13 +1,13 @@
 {% load card_badge %}
 {% if cards %}
     <div class="mx-4 grid gap-3 grid-cols-[repeat(auto-fit,minmax(150px,1fr))] justify-items-center">
-    {% for card in cards %}
-      <a href="{% url 'cards:card_detail' card.id %}"
-        class="flex justify-between items-center text-primary no-underline">
-        {% card_badge card card.offer_count %}
-      </a>
-    {% endfor %}
-  </div>
+      {% for card in cards %}
+        <a href="{% url 'cards:card_detail' card.id %}"
+          class="flex justify-between items-center text-primary no-underline">
+          {% card_badge card quantity=card.offer_count static=True %}
+        </a>
+      {% endfor %}
+    </div>
 {% else %}
   <p class="text-center">No cards found</p>
 {% endif %} 

theme/templates/trades/_trade_offer_list.html

@@ -4,7 +4,7 @@
   For a TradeOffer, we use {% render_trade_offer %}; for a TradeAcceptance, {% render_trade_acceptance %}.
 {% endcomment %}
 
-<div class="flex flex-row gap-4 flex-wrap justify-center items-start">
+<div class="flex flex-row gap-2 flex-wrap justify-center items-start">
   {% for offer in offers %}
     <div class="flex flex-none">
       {% if offer.accepted_by %}

theme/templates/trades/trade_acceptance_create.html

@@ -8,7 +8,7 @@
   <form method="post" novalidate>
     {% csrf_token %}
     {{ form.as_p }}
-    <button type="submit" class="btn btn-primary">Submit Acceptance</button>
+    <button type="submit" class="btn btn-primary">Accept Trade</button>
   </form>
   {% if form.errors %}
     <div class="alert alert-error mt-4">

theme/templates/trades/trade_offer_all_list.html

@@ -4,7 +4,7 @@
 {% block title %}Trade Offers{% endblock title %}
 
 {% block content %}
-<div class="container mx-auto max-w-4xl mt-6" x-data="{
+<div x-data="{
     // Initialize allExpanded from the URL if present, defaulting to false.
     allExpanded: new URLSearchParams(window.location.search).get('expanded') === 'true',
     page: {{ page_obj.number|default:1 }},

theme/templates/trades/trade_offer_detail.html

@@ -46,7 +46,7 @@
       </div>
     {% endif %}
 
-    <div class="mt-6 flex justify-between">
+    <div class="mt-6 flex justify-end">
       {% if is_initiator %}
         <a href="{{ delete_close_url }}" class="btn btn-danger">Delete/Close Trade Offer</a>
       {% elif request.user.is_authenticated %}