Fix styling of friend codes list

This commit is contained in:
badblocks 2025-03-14 11:08:01 -07:00
parent bc181b12d9
commit 36f97be9d0
2 changed files with 23 additions and 11 deletions

View file

@ -3,27 +3,28 @@
{% block title %}My Friend Codes{% endblock %}
{% block content %}
<div class="container mx-auto max-w-xl mt-6">
<div class="container mx-auto max-w-3xl mt-6">
<h1 class="text-3xl font-bold mb-4">My Friend Codes</h1>
{% if friend_codes %}
<ul class="space-y-2">
{% for code in friend_codes %}
<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">
<li class="w-full grid grid-cols-2 grid-rows-2 md:grid-cols-8 md:grid-rows-1 items-center {% if code.is_default %}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="row-start-1 md:col-span-3">
<span>{{ code.in_game_name }}</span>
{% if code.is_default %}
<span class="badge badge-success ml-2">Default</span>
{% endif %}
</div>
<div class="flex-3 text-center">
<span class="font-mono">{{ code.friend_code }}</span>
<div class="row-start-2 col-start-1 md:row-start-1 md:col-span-3 {% if not code.is_default %}mr-4{% endif %}">
<span class="font-mono text-sm sm:text-base">{{ 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 %}
<div class="row-start-2 col-start-2 md:row-start-1 md:col-span-2 flex justify-end space-x-2">
{% if not code.is_default %}
<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>
<button type="submit" class="btn btn-secondary btn-sm">Set 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>