From d315810844293721c410d870e98d35c87aa50bd2 Mon Sep 17 00:00:00 2001
From: Felix Turner <felixturner@gmail.com>
Date: Fri, 19 Sep 2025 15:03:16 -0700
Subject: [PATCH] [feat] Improve template modal UI layout and spacing

- Increase card description display from 2 to 4 lines for more content visibility
- Remove header padding for cleaner layout in TemplateWorkflowView
- Reduce search bar width for better proportions

These changes improve the overall user experience and visual balance of the template browser modal.
---
 src/components/templates/TemplateSearchBar.vue    | 4 ++--
 src/components/templates/TemplateWorkflowCard.vue | 2 +-
 src/components/templates/TemplateWorkflowView.vue | 5 +++--
 3 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/components/templates/TemplateSearchBar.vue b/src/components/templates/TemplateSearchBar.vue
index 17b564b126..08d0af5281 100644
--- a/src/components/templates/TemplateSearchBar.vue
+++ b/src/components/templates/TemplateSearchBar.vue
@@ -1,7 +1,7 @@
 <template>
-  <div class="relative w-full p-4">
+  <div class="relative w-full">
     <div class="h-12 flex items-center gap-4 justify-between">
-      <div class="flex-1 max-w-md">
+      <div class="flex-1 max-w-xs">
         <AutoComplete
           v-model.lazy="searchQuery"
           :placeholder="$t('templateWorkflows.searchPlaceholder')"
diff --git a/src/components/templates/TemplateWorkflowCard.vue b/src/components/templates/TemplateWorkflowCard.vue
index eb6a930388..9f70745984 100644
--- a/src/components/templates/TemplateWorkflowCard.vue
+++ b/src/components/templates/TemplateWorkflowCard.vue
@@ -67,7 +67,7 @@
           <h3 class="line-clamp-2 text-lg font-normal mb-0" :title="title">
             {{ title }}
           </h3>
-          <p class="line-clamp-2 text-sm text-muted grow" :title="description">
+          <p class="line-clamp-4 text-sm text-muted grow" :title="description">
             {{ description }}
           </p>
         </div>
diff --git a/src/components/templates/TemplateWorkflowView.vue b/src/components/templates/TemplateWorkflowView.vue
index 9c73ddc86c..182ebe1c98 100644
--- a/src/components/templates/TemplateWorkflowView.vue
+++ b/src/components/templates/TemplateWorkflowView.vue
@@ -5,11 +5,12 @@
     data-key="name"
     :lazy="true"
     pt:root="h-full grid grid-rows-[auto_1fr_auto]"
+    pt:header="p-0"
     pt:content="p-2 overflow-auto"
   >
     <template #header>
-      <div class="flex flex-col">
-        <div class="flex justify-between items-center mb-4">
+      <div class="flex flex-col mb-4">
+        <div class="flex justify-between items-center">
           <h2 class="text-lg">{{ title }}</h2>
           <SelectButton
             v-model="layout"