feat: Enhance UI components with improved styles and responsiveness across various views
This commit is contained in:
@@ -12,15 +12,22 @@
|
||||
<div class="bg-background-secondary/50 border border-neutral p-6 rounded-xl shadow-lg mb-6">
|
||||
<div class="flex flex-col gap-5 max-h-[60vh] overflow-y-auto pr-4 custom-scrollbar" wire:poll.5s>
|
||||
@foreach ($ticket->messages()->with('user')->get() as $index => $message)
|
||||
@php
|
||||
$isMine = $message->user_id === auth()->id();
|
||||
$isStaff = ! $isMine && ($message->user->role_id ?? null);
|
||||
@endphp
|
||||
<div
|
||||
class="bg-background/10 border border-neutral/20 p-4 rounded-lg
|
||||
w-full max-w-[80%] {{ $message->user_id === auth()->id() ? 'ml-auto bg-primary/10 border-primary/20' : 'mr-auto' }}
|
||||
transition-all duration-200">
|
||||
class="p-4 rounded-lg w-full max-w-[80%] transition-all duration-200
|
||||
{{ $isMine ? 'ml-auto bg-primary/15 border border-primary/25' : 'mr-auto glass-panel' }}
|
||||
{{ $isStaff ? 'border-l-2 border-l-secondary' : '' }}">
|
||||
<div class="flex items-center justify-between mb-2">
|
||||
<div>
|
||||
<div class="flex items-center gap-2">
|
||||
<h3 class="font-semibold text-color-base text-lg">{{ $message->user->name }}</h3>
|
||||
<p class="text-sm text-neutral-400">{{ $message->created_at->diffForHumans() }}</p>
|
||||
@if($isStaff)
|
||||
<span class="text-[10px] uppercase tracking-wider font-bold px-1.5 py-0.5 rounded bg-secondary/15 text-secondary">{{ __('Staff') }}</span>
|
||||
@endif
|
||||
</div>
|
||||
<p class="text-sm text-neutral-400">{{ $message->created_at->diffForHumans() }}</p>
|
||||
</div>
|
||||
<div class="mt-2 prose dark:prose-invert max-w-none text-color-base">
|
||||
{!! Str::markdown(nl2br(e($message->message)), ['allow_unsafe_links' => false]) !!}
|
||||
|
||||
Reference in New Issue
Block a user