ui updates for ticket layout

Modules/Helpdesk/Resources/views/livewire/ticket-show.blade.php

@@ -251,36 +251,40 @@
             </article>
 
             @if ($ticket->attachments->isNotEmpty())
-            <div class="overflow-hidden rounded-2xl border border-blue-200 bg-white shadow-sm dark:border-blue-900/60 dark:bg-zinc-900">
+            <details class="overflow-hidden rounded-2xl border border-zinc-200 bg-white shadow-sm dark:border-zinc-700 dark:bg-zinc-900" open>
-                <div class="bg-gradient-to-r from-blue-700 via-sky-600 to-emerald-600 px-6 py-4 text-white">
+                <summary class="flex cursor-pointer list-none items-center justify-between gap-5 bg-gradient-to-r from-slate-950 via-blue-950 to-slate-900 px-7 py-7 text-white marker:hidden sm:px-9">
-                    <div class="flex items-center justify-between gap-4">
+                    <div class="flex min-w-0 items-start gap-5">
-                        <div>
+                        <span class="inline-flex h-14 w-14 shrink-0 items-center justify-center rounded-2xl bg-blue-500/25 text-white ring-1 ring-white/20 shadow-lg shadow-black/20">
-                            <h2 class="flex items-center gap-2 text-base font-extrabold text-white drop-shadow-sm">
+                            <i class="fa-solid fa-paperclip text-xl" aria-hidden="true"></i>
-                                <span class="inline-flex h-9 w-9 items-center justify-center rounded-xl bg-white/15 ring-1 ring-white/25">
-                                    <i class="fa-solid fa-paperclip" aria-hidden="true"></i>
-                                </span>
-                                Ticket attachments
-                            </h2>
-                            <p class="mt-1 text-sm font-medium text-blue-50/90">
-                                Supporting screenshots, documents and logs linked to this ticket.
-                            </p>
-                        </div>
-
-                        <span class="inline-flex items-center gap-2 rounded-full bg-emerald-100 px-3 py-1 text-xs font-extrabold text-emerald-800 shadow-sm ring-1 ring-white/70">
-                            <span class="inline-flex h-2 w-2 rounded-full bg-emerald-500"></span>{{ $ticket->attachments->count() }} file(s)
                         </span>
+                        <div class="min-w-0 space-y-2">
+                            <p class="text-xs font-black uppercase tracking-[0.22em] text-blue-200">Ticket attachments</p>
+                            <h2 class="text-2xl font-extrabold tracking-tight sm:text-3xl">Supporting files</h2>
+                            <p class="text-base font-medium leading-7 text-blue-50/85">Screenshots, documents and logs linked to this ticket.</p>
+                        </div>
                     </div>
-                </div>
+
+                    <span class="inline-flex shrink-0 items-center gap-3 rounded-2xl bg-white/15 px-5 py-3 text-base font-extrabold ring-1 ring-white/20 shadow-sm">
+                        <i class="fa-solid fa-paperclip text-sm" aria-hidden="true"></i>
+                        {{ $ticket->attachments->count() }} file{{ $ticket->attachments->count() === 1 ? '' : 's' }}
+                        <i class="fa-solid fa-chevron-right transition" aria-hidden="true"></i>
+                    </span>
+                </summary>
 
                 <div class="grid gap-3 p-6 sm:grid-cols-2">
                     @foreach ($ticket->attachments as $attachment)
-                        <a href="{{ route('helpdesk.attachments.download', $attachment->id) }}" target="_blank" class="rounded-xl border border-zinc-200 p-3 text-sm hover:bg-zinc-50 dark:border-zinc-700 dark:hover:bg-zinc-800">
+                        <a href="{{ route('helpdesk.attachments.download', $attachment->id) }}" target="_blank" class="group flex items-center justify-between gap-4 rounded-xl border border-zinc-200 p-4 text-sm transition hover:bg-zinc-50 dark:border-zinc-700 dark:hover:bg-zinc-800">
-                            <div class="font-medium text-zinc-900 dark:text-zinc-100">{{ $attachment->original_name ?? $attachment->original_filename ?? $attachment->filename ?? $attachment->file_name ?? basename($attachment->path ?? $attachment->file_path ?? '') }}</div>
+                            <span class="min-w-0">
-                            <div class="text-xs text-zinc-500">{{ Number::fileSize($attachment->size ?? $attachment->size_bytes ?? 0) }}</div>
+                                <span class="block truncate font-bold text-zinc-900 dark:text-zinc-100">{{ $attachment->original_name ?? $attachment->original_filename ?? $attachment->filename ?? $attachment->file_name ?? basename($attachment->path ?? $attachment->file_path ?? '') }}</span>
+                                <span class="block text-xs text-zinc-500">{{ Number::fileSize($attachment->size ?? $attachment->size_bytes ?? 0) }}</span>
+                            </span>
+                            <span class="inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-zinc-100 text-zinc-700 transition group-hover:bg-blue-600 group-hover:text-white dark:bg-zinc-800 dark:text-zinc-200">
+                                <i class="fa-solid fa-download" aria-hidden="true"></i>
+                            </span>
                         </a>
                     @endforeach
                 </div>
-            </div>
+            </details>
             @endif
 
             <section class="space-y-4">

Modules/Helpdesk/changelog.yaml

@@ -270,3 +270,14 @@ versions:
     - "Added page-local professional Helpdesk document styling so ticket document, conversation, and Add reply sections have balanced spacing, smaller header icons, non-squashed body areas, and readable editor controls even before module assets are rebuilt."
     - "Kept the conversation collapsed by default while preserving the Lotus Notes-style document response workflow."
     - "Kept module.json version in sync with changelog.yaml."
+
+
+- version: 1.7.4
+  date: 2026-06-17
+  type: changed
+  summary: "Matched the ticket attachments header to the professional Document responses header styling."
+  changes:
+    - "Reworked the ticket attachments section header to use the same dark professional document header pattern as Document responses."
+    - "Replaced the bright green-blue attachment banner with a consistent navy gradient, balanced icon sizing, document-style title, and professional file count badge."
+    - "Improved attachment file rows with clearer spacing and a download affordance while preserving existing attachment download routes."
+    - "Kept module.json version in sync with changelog.yaml."

Modules/Helpdesk/module.json

@@ -22,5 +22,5 @@
         "Modules\\Helpdesk\\Providers\\HelpdeskServiceProvider"
     ],
     "files": [],
-    "version": "1.7.3"
+    "version": "1.7.4"
 }