Update dark mode styling for submission list to match site theme

This commit is contained in:
pacnpal
2024-11-13 18:53:03 +00:00
parent a30f3ef644
commit 131ef7ceb0

View File

@@ -1,11 +1,11 @@
{% for submission in submissions %}
<div class="p-6 bg-gray-900 rounded-lg"
<div class="p-6 bg-white border rounded-lg dark:bg-gray-800 border-gray-200/50 dark:border-gray-700/50"
id="submission-{{ submission.id }}"
x-data="{ showSuccess: false }"
@htmx:afterOnLoad="showSuccess = true; setTimeout(() => showSuccess = false, 3000)">
<div class="mb-4 submission-header">
<div>
<h3 class="flex items-center gap-3 text-lg font-semibold text-gray-300">
<h3 class="flex items-center gap-3 text-lg font-semibold text-gray-900 dark:text-gray-300">
<span class="status-badge
{% if submission.status == 'NEW' %}status-pending
{% elif submission.status == 'APPROVED' %}status-approved
@@ -20,7 +20,7 @@
{{ submission.get_content_type_display }} -
{% if submission.submission_type == 'CREATE' %}New{% else %}Edit{% endif %}
</h3>
<div class="mt-2 text-gray-400">
<div class="mt-2 text-gray-600 dark:text-gray-400">
<span class="inline-flex items-center">
<i class="mr-1.5 fas fa-user"></i>
{{ submission.user.username }}
@@ -42,19 +42,19 @@
</div>
{% if submission.reason %}
<div class="p-4 mt-3 bg-gray-800 rounded-lg">
<div class="text-sm font-medium text-gray-300">Reason:</div>
<div class="mt-1.5 text-gray-400">{{ submission.reason }}</div>
<div class="p-4 mt-3 bg-gray-100 border rounded-lg dark:bg-gray-900 border-gray-200/50 dark:border-gray-700/50">
<div class="text-sm font-medium text-gray-900 dark:text-gray-300">Reason:</div>
<div class="mt-1.5 text-gray-600 dark:text-gray-400">{{ submission.reason }}</div>
</div>
{% endif %}
{% if submission.source %}
<div class="p-4 mt-3 bg-gray-800 rounded-lg">
<div class="text-sm font-medium text-gray-300">Source:</div>
<div class="p-4 mt-3 bg-gray-100 border rounded-lg dark:bg-gray-900 border-gray-200/50 dark:border-gray-700/50">
<div class="text-sm font-medium text-gray-900 dark:text-gray-300">Source:</div>
<div class="mt-1.5">
<a href="{{ submission.source }}"
target="_blank"
class="inline-flex items-center text-blue-400 hover:text-blue-300">
class="inline-flex items-center text-blue-600 hover:text-blue-500 dark:text-blue-400 dark:hover:text-blue-300">
<span>{{ submission.source }}</span>
<i class="ml-1.5 text-xs fas fa-external-link-alt"></i>
</a>
@@ -64,11 +64,11 @@
<div class="mt-4 space-y-3">
{% for field, value in submission.changes.items %}
<div class="p-4 bg-gray-800 rounded-lg">
<div class="text-sm font-medium text-gray-300">
<div class="p-4 bg-gray-100 border rounded-lg dark:bg-gray-900 border-gray-200/50 dark:border-gray-700/50">
<div class="text-sm font-medium text-gray-900 dark:text-gray-300">
{{ field|title }}:
</div>
<div class="mt-1.5 text-gray-400">
<div class="mt-1.5 text-gray-600 dark:text-gray-400">
{{ value }}
</div>
</div>
@@ -76,9 +76,9 @@
</div>
{% if submission.notes %}
<div class="p-4 mt-4 rounded-lg bg-blue-900/30">
<div class="text-sm font-medium text-blue-300">Review Notes:</div>
<div class="mt-1.5 text-blue-200">{{ submission.notes }}</div>
<div class="p-4 mt-4 border rounded-lg bg-blue-50 dark:bg-blue-900/30 border-blue-200/50 dark:border-blue-700/50">
<div class="text-sm font-medium text-blue-900 dark:text-blue-300">Review Notes:</div>
<div class="mt-1.5 text-blue-800 dark:text-blue-200">{{ submission.notes }}</div>
</div>
{% endif %}
@@ -92,7 +92,7 @@
x-transition:leave-start="opacity-100 transform translate-y-0"
x-transition:leave-end="opacity-0 transform -translate-y-2">
<textarea name="notes"
class="w-full px-4 py-3 text-gray-300 bg-gray-800 border border-gray-700 rounded-lg resize-none focus:ring-2 focus:ring-blue-500"
class="w-full px-4 py-3 text-gray-900 bg-white border rounded-lg resize-none dark:text-gray-300 dark:bg-gray-900 border-gray-200/50 dark:border-gray-700/50 focus:ring-2 focus:ring-blue-500"
placeholder="Add review notes (optional)"
rows="3"></textarea>
</div>
@@ -142,8 +142,8 @@
{% endif %}
</div>
{% empty %}
<div class="p-8 text-center bg-gray-900 rounded-lg">
<div class="text-gray-400">
<div class="p-8 text-center bg-white border rounded-lg dark:bg-gray-800 border-gray-200/50 dark:border-gray-700/50">
<div class="text-gray-600 dark:text-gray-400">
<i class="mb-4 text-5xl fas fa-inbox"></i>
<p class="text-lg">No submissions found matching your filters.</p>
</div>