From 707546f279f554de67b81c4f5aa3ec3386e1db79 Mon Sep 17 00:00:00 2001
From: pac7 <47831526-pac7@users.noreply.replit.com>
Date: Mon, 22 Sep 2025 14:50:43 +0000
Subject: [PATCH] Improve park status display and add new styles for dark mode

Update park status handling to include more variations and add new dark mode CSS classes for purple and yellow color schemes.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 0bdea3fb-49ea-4863-b501-fa6f5af0cbf0
Replit-Commit-Checkpoint-Type: intermediate_checkpoint
---
 static/css/tailwind.css         | 13 +++++++++++++
 templates/cotton/park_card.html | 22 ++++++++++++----------
 2 files changed, 25 insertions(+), 10 deletions(-)

diff --git a/static/css/tailwind.css b/static/css/tailwind.css
index 148cd1b0..2e75e5d1 100644
--- a/static/css/tailwind.css
+++ b/static/css/tailwind.css
@@ -3689,6 +3689,11 @@
       border-color: var(--color-green-800);
     }
   }
+  .dark\:border-purple-800 {
+    @media (prefers-color-scheme: dark) {
+      border-color: var(--color-purple-800);
+    }
+  }
   .dark\:border-purple-800\/50 {
     @media (prefers-color-scheme: dark) {
       border-color: color-mix(in srgb, oklch(43.8% 0.218 303.724) 50%, transparent);
@@ -3875,6 +3880,14 @@
       background-color: var(--color-purple-900);
     }
   }
+  .dark\:bg-purple-900\/20 {
+    @media (prefers-color-scheme: dark) {
+      background-color: color-mix(in srgb, oklch(38.1% 0.176 304.987) 20%, transparent);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--color-purple-900) 20%, transparent);
+      }
+    }
+  }
   .dark\:bg-purple-900\/30 {
     @media (prefers-color-scheme: dark) {
       background-color: color-mix(in srgb, oklch(38.1% 0.176 304.987) 30%, transparent);
diff --git a/templates/cotton/park_card.html b/templates/cotton/park_card.html
index 73fe0ee5..29e551f7 100644
--- a/templates/cotton/park_card.html
+++ b/templates/cotton/park_card.html
@@ -70,12 +70,13 @@ Features:
                             
                             {# Status Badge #}
                             <span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-semibold border
-                                       {% if park.status == 'operating' %}bg-green-50 text-green-700 border-green-200 dark:bg-green-900/20 dark:text-green-400 dark:border-green-800
-                                       {% elif park.status == 'closed' %}bg-red-50 text-red-700 border-red-200 dark:bg-red-900/20 dark:text-red-400 dark:border-red-800
+                                       {% if park.status == 'operating' or park.status == 'OPERATING' %}bg-green-50 text-green-700 border-green-200 dark:bg-green-900/20 dark:text-green-400 dark:border-green-800
+                                       {% elif park.status == 'closed' or park.status == 'CLOSED_PERM' or park.status == 'closed_permanently' or park.status == 'closed_perm' %}bg-red-50 text-red-700 border-red-200 dark:bg-red-900/20 dark:text-red-400 dark:border-red-800
                                        {% elif park.status == 'seasonal' %}bg-blue-50 text-blue-700 border-blue-200 dark:bg-blue-900/20 dark:text-blue-400 dark:border-blue-800
-                                       {% elif park.status == 'closed_temp' %}bg-yellow-50 text-yellow-700 border-yellow-200 dark:bg-yellow-900/20 dark:text-yellow-400 dark:border-yellow-800
-                                       {% elif park.status == 'closed_permanently' or park.status == 'closed_perm' %}bg-red-50 text-red-700 border-red-200 dark:bg-red-900/20 dark:text-red-400 dark:border-red-800
-                                       {% elif park.status == 'under_construction' %}bg-blue-50 text-blue-700 border-blue-200 dark:bg-blue-900/20 dark:text-blue-400 dark:border-blue-800
+                                       {% elif park.status == 'closed_temp' or park.status == 'CLOSED_TEMP' %}bg-yellow-50 text-yellow-700 border-yellow-200 dark:bg-yellow-900/20 dark:text-yellow-400 dark:border-yellow-800
+                                       {% elif park.status == 'under_construction' or park.status == 'UNDER_CONSTRUCTION' %}bg-blue-50 text-blue-700 border-blue-200 dark:bg-blue-900/20 dark:text-blue-400 dark:border-blue-800
+                                       {% elif park.status == 'demolished' or park.status == 'DEMOLISHED' %}bg-gray-50 text-gray-700 border-gray-200 dark:bg-gray-700 dark:text-gray-300 dark:border-gray-600
+                                       {% elif park.status == 'relocated' or park.status == 'RELOCATED' %}bg-purple-50 text-purple-700 border-purple-200 dark:bg-purple-900/20 dark:text-purple-400 dark:border-purple-800
                                        {% else %}bg-gray-50 text-gray-700 border-gray-200 dark:bg-gray-700 dark:text-gray-300 dark:border-gray-600{% endif %}">
                                 {{ park.get_status_display }}
                             </span>
@@ -143,12 +144,13 @@ Features:
                     
                     {# Status Badge #}
                     <span class="inline-flex items-center px-2.5 py-1 rounded-full text-xs font-semibold border shrink-0
-                               {% if park.status == 'operating' %}bg-green-50 text-green-700 border-green-200 dark:bg-green-900/20 dark:text-green-400 dark:border-green-800
-                               {% elif park.status == 'closed' %}bg-red-50 text-red-700 border-red-200 dark:bg-red-900/20 dark:text-red-400 dark:border-red-800
+                               {% if park.status == 'operating' or park.status == 'OPERATING' %}bg-green-50 text-green-700 border-green-200 dark:bg-green-900/20 dark:text-green-400 dark:border-green-800
+                               {% elif park.status == 'closed' or park.status == 'CLOSED_PERM' or park.status == 'closed_permanently' or park.status == 'closed_perm' %}bg-red-50 text-red-700 border-red-200 dark:bg-red-900/20 dark:text-red-400 dark:border-red-800
                                {% elif park.status == 'seasonal' %}bg-blue-50 text-blue-700 border-blue-200 dark:bg-blue-900/20 dark:text-blue-400 dark:border-blue-800
-                               {% elif park.status == 'closed_temp' %}bg-yellow-50 text-yellow-700 border-yellow-200 dark:bg-yellow-900/20 dark:text-yellow-400 dark:border-yellow-800
-                               {% elif park.status == 'closed_permanently' or park.status == 'closed_perm' %}bg-red-50 text-red-700 border-red-200 dark:bg-red-900/20 dark:text-red-400 dark:border-red-800
-                               {% elif park.status == 'under_construction' %}bg-blue-50 text-blue-700 border-blue-200 dark:bg-blue-900/20 dark:text-blue-400 dark:border-blue-800
+                               {% elif park.status == 'closed_temp' or park.status == 'CLOSED_TEMP' %}bg-yellow-50 text-yellow-700 border-yellow-200 dark:bg-yellow-900/20 dark:text-yellow-400 dark:border-yellow-800
+                               {% elif park.status == 'under_construction' or park.status == 'UNDER_CONSTRUCTION' %}bg-blue-50 text-blue-700 border-blue-200 dark:bg-blue-900/20 dark:text-blue-400 dark:border-blue-800
+                               {% elif park.status == 'demolished' or park.status == 'DEMOLISHED' %}bg-gray-50 text-gray-700 border-gray-200 dark:bg-gray-700 dark:text-gray-300 dark:border-gray-600
+                               {% elif park.status == 'relocated' or park.status == 'RELOCATED' %}bg-purple-50 text-purple-700 border-purple-200 dark:bg-purple-900/20 dark:text-purple-400 dark:border-purple-800
                                {% else %}bg-gray-50 text-gray-700 border-gray-200 dark:bg-gray-700 dark:text-gray-300 dark:border-gray-600{% endif %}">
                         {{ park.get_status_display }}
                     </span>