From cf09754418a767d99e77f38c0eec2ccc08f16604 Mon Sep 17 00:00:00 2001
From: Keith Solomon <keith@vincentdesign.ca>
Date: Wed, 16 Jul 2025 22:49:44 -0500
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9E=20fix:=20Styling=20tweaks?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/PromptCard.astro | 14 +++++++-------
 src/components/SearchBar.astro  |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/components/PromptCard.astro b/src/components/PromptCard.astro
index a1aa718..b6bd4f2 100644
--- a/src/components/PromptCard.astro
+++ b/src/components/PromptCard.astro
@@ -25,27 +25,27 @@ const formatDate = (dateStr: string | undefined) => {
 
 <div class="border border-gray-400 rounded p-4 bg-gray-700 text-gray-200 shadow-sm flex flex-col gap-2 min-h-[12rem]">
   <div class="flex items-center justify-between">
-    <h3 class="text-lg font-semibold">{title}</h3>
-    <span class={`text-xs font-medium px-2 py-1 rounded ${
+    <h3 class="text-xl font-semibold">{title}</h3>
+    <span class={`text-sm font-medium px-2 py-1 rounded ${
       type === 'System' ? 'bg-blue-100 text-blue-700' : 'bg-green-100 text-green-700'
     }`}>
       {type}
     </span>
   </div>
 
-  <p class="text-sm">{notes}</p>
+  <p class="text-md">{notes}</p>
 
   <div class="flex flex-wrap gap-2 mt-2">
     {tags.map((tag: string) => (
-      <span class="text-xs bg-gray-200 text-gray-800 px-2 py-1 pt-0 rounded">{tag}</span>
+      <span class="text-sm bg-gray-200 text-gray-800 px-2 py-1 pt-0 rounded">{tag}</span>
     ))}
   </div>
 
   <details name="prompt-details">
-    <summary class="cursor-pointer font-semibold mt-2">View Details</summary>
+    <summary class="cursor-pointer font-semibold mt-2 text-lg">View Details</summary>
     <div class="text-md border-t mt-2 pt-2">
-      <h3 class="text-lg font-semibold">Prompt</h3>
-      <p class="my-2">{description}</p>
+      <h3 class="text-xl font-semibold px-2">Prompt</h3>
+      <p class="my-2 px-2 text-balance">{description}</p>
       <hr class="my-2" />
       <p class="text-sm"><strong>Created:</strong> {formatDate(created_at)} &bull; <strong>Updated:</strong> {formatDate(updated_at)}</p>
     </div>
diff --git a/src/components/SearchBar.astro b/src/components/SearchBar.astro
index 3f5bab4..f92e718 100644
--- a/src/components/SearchBar.astro
+++ b/src/components/SearchBar.astro
@@ -41,7 +41,7 @@
                   value={tag}
                   class="sr-only peer"
                 />
-                <span class="px-3 py-1 pt-0 rounded-full border border-gray-300 peer-checked:bg-blue-600 peer-checked:text-white hover:bg-blue-600 hover:text-white text-sm">
+                <span class="px-3 py-1 pt-0 rounded-full border border-gray-300 peer-checked:bg-blue-600 peer-checked:text-white hover:bg-blue-600 hover:text-white transition-colors duration-300 text-sm">
                   {tag}
                 </span>
               </label>