Add in_game_name field to FriendCode model

theme/templates/_messages.html

@@ -1,8 +1,9 @@
 {% if messages %}
   <div class="flex flex-col gap-2">
     {% for message in messages %}
-      <div class="alert alert-{{ message.tags }} bg-base-100 mb-4">
-        {{ message }}
+      <div class="alert alert-{{ message.tags }} bg-base-100 mb-4 flex justify-between items-center">
+        <span>{{ message }}</span>
+        <button class="btn btn-xs btn-circle" onclick="this.parentElement.remove();" aria-label="Dismiss">✕</button>
       </div>
     {% endfor %}
   </div>

theme/templates/account/settings.html

@@ -15,7 +15,7 @@
         {% trans "Friend Codes" %}
       </a>
       <a href="{% url 'account_logout' %}" class="btn btn-warning">
-        {% trans "Logout" %}
+        {% trans "Sign Out" %}
       </a>
     </div>
   </div>

theme/templates/account/signup.html

@@ -1,6 +1,7 @@
 {% extends 'base.html' %}
 {% load i18n %}
 
+
 {% block head_title %}{% trans "Sign Up" %}{% endblock %}
 
 {% block content %}
@@ -34,6 +35,11 @@
       {{ form.friend_code }}
       {{ form.friend_code.errors }}
     </div>
+    <div>
+      <label for="{{ form.in_game_name.id_for_label }}" class="block font-medium">{{ form.in_game_name.label }}</label>
+      {{ form.in_game_name }}
+      {{ form.in_game_name.errors }}
+    </div>
     <button type="submit" class="btn btn-primary w-full">{% trans "Sign Up" %}</button>
   </form>
   <div class="mt-4 text-center">

theme/templates/base.html

@@ -24,7 +24,7 @@
     })();
   </script>
   
-  <title>{% block title %}PᴋMɴ Trade Club{% endblock title %}</title>
+  <title>[PᴋMɴ Trade Club] {% block title %}{% endblock title %}</title>
   <link rel="shortcut icon" href="{% static 'images/favicon.ico' %}">
   <!-- Choices.js -->
   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/choices.js@11.0.6/public/assets/styles/choices.min.css" />
@@ -113,7 +113,7 @@
                   Friend Codes
                 </a>
               </li>
-              <li><a href="{% url 'account_logout' %}">Logout</a></li>
+              <li><a href="{% url 'account_logout' %}">Sign Out</a></li>
             </ul>
           </div>
         </div>

theme/templates/friend_codes/add_friend_code.html

@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% load crispy_forms_tags %}
+{% load crispy_forms_tags i18n %}
 
 {% block title %}Add Friend Code{% endblock %}
 
@@ -8,8 +8,18 @@
   <h1 class="text-3xl font-bold mb-4">Add Friend Code</h1>
   <form method="post" class="space-y-4">
     {% csrf_token %}
-    {{ form|crispy }}
-    <button type="submit" class="btn btn-primary w-full">Add Friend Code</button>
+    {{ form.non_field_errors }}
+    <div>
+      <label for="{{ form.friend_code.id_for_label }}" class="block font-medium">{{ form.friend_code.label }}</label>
+      {{ form.friend_code }}
+      {{ form.friend_code.errors }}
+    </div>
+    <div>
+      <label for="{{ form.in_game_name.id_for_label }}" class="block font-medium">{{ form.in_game_name.label }}</label>
+      {{ form.in_game_name }}
+      {{ form.in_game_name.errors }}
+    </div>
+    <button type="submit" class="btn btn-primary w-full">{% trans "Add Friend Code" %}</button>
   </form>
   
   <div class="mt-4">
@@ -19,11 +29,11 @@
 
 <!-- Include Cleave Zen from a CDN -->
 <script src="https://unpkg.com/cleave-zen@0.0.17/dist/cleave-zen.umd.js"></script>
-<script>
+<script defer>
   document.addEventListener('DOMContentLoaded', function(){
     // Initialize Cleave Zen on the friend code input field.
     // Make sure that the input ID is correct (e.g., provided by Django's widget rendering).
-    new CleaveZen('#id_friend_code', {
+    cleaveZen('#id_friend_code', {
       delimiters: ['-', '-', '-'], // Inserts dashes between the blocks.
       blocks: [4, 4, 4, 4],
       numericOnly: true

theme/templates/friend_codes/list_friend_codes.html

@@ -9,19 +9,21 @@
   {% if friend_codes %}
     <ul class="space-y-2">
       {% for code in friend_codes %}
-      <li class="flex items-center justify-between {% if user.default_friend_code and code.id == user.default_friend_code.id %}bg-green-200 dark:bg-green-300 dark:text-base-100{% else %}bg-base-100 dark:bg-base-900 dark:text-white{% endif %} p-4 rounded shadow">
-        <div>
-          <span class="font-mono">{{ code.friend_code }}</span>
-          {% if user.default_friend_code and code.id == user.default_friend_code.id %}
-            <span class="badge badge-success ml-2">Default</span>
-          {% endif %}
+      <li class="flex flex-col sm:flex-row items-start sm:items-center justify-between {% if user.default_friend_code and code.id == user.default_friend_code.id %}bg-green-200 dark:bg-green-300 dark:text-base-100{% else %}bg-base-100 dark:bg-base-900 dark:text-white{% endif %} p-4 rounded shadow">
+        <div class="flex-2">
+          <span>{{ code.in_game_name }}</span>
         </div>
-        <div class="flex items-center space-x-2">
+        <div class="flex-3 text-center">
+          <span class="font-mono">{{ code.friend_code }}</span>
+        </div>
+        <div class="flex-2 flex items-center space-x-2 self-end">
           {% if user.default_friend_code and not code.id == user.default_friend_code.id %}
             <form method="post" action="{% url 'change_default_friend_code' code.id %}">
               {% csrf_token %}
               <button type="submit" class="btn btn-secondary btn-sm">Set as Default</button>
             </form>
+          {% elif user.default_friend_code and code.id == user.default_friend_code.id %}
+            <span class="badge badge-success ml-2">Default</span>
           {% endif %}
           <a href="{% url 'delete_friend_code' code.id %}" class="btn btn-error btn-sm">Delete</a>
         </div>

theme/templates/home/home.html

@@ -27,11 +27,9 @@
         <button type="submit" class="btn btn-primary grow">
           Find a Trade Offer
         </button>
-        {% if user.is_authenticated %}
-          <a href="{% url 'trade_offer_create' %}" id="createTradeOfferBtn" class="btn btn-secondary grow">
-            Create Trade Offer
-          </a>
-        {% endif %}
+        <a href="{% url 'trade_offer_create' %}" id="createTradeOfferBtn" class="btn btn-secondary grow">
+          Create Trade Offer
+        </a>
       </div>
     </form>
   </section>

theme/templates/trades/_friend_code_select.html

@@ -4,7 +4,7 @@ Expected variables:
   - friend_codes: A list or QuerySet of FriendCode objects.
   - selected_friend_code (optional): The currently selected FriendCode. If not provided, the user's default friend code is used.
   - field_name (optional): The name/id for the input element (default "friend_code").
-  - label (optional): The label text (default "Friend Code").
+  - label (optional): The label text (default None).
 {% endcomment %}
 
 {% with field_name=field_name|default:"friend_code" label=label|default:"" %}
@@ -19,7 +19,7 @@ Expected variables:
         <select id="{{ field_name }}" name="{{ field_name }}" class="select select-bordered w-full" @change="$el.form.submit()">
           {% for code in friend_codes %}
             <option value="{{ code.pk }}" {% if effective_friend_code and code.pk|stringformat:"s" == effective_friend_code.pk|stringformat:"s" %}selected{% endif %}>
-              {{ code.friend_code }}
+              {{ code.in_game_name }}
             </option>
           {% endfor %}
         </select>