removed dark mod and applied fixes for text colors
This commit is contained in:
@@ -115,18 +115,18 @@ new class extends Component {
|
||||
<flux:heading size="xl">{{ __('timelines.create_timeline') }}</flux:heading>
|
||||
</div>
|
||||
|
||||
<div class="rounded-lg border border-zinc-200 bg-white p-6 dark:border-zinc-700 dark:bg-zinc-800">
|
||||
<div class="rounded-lg border border-zinc-200 bg-white p-6 ">
|
||||
<form wire:submit="create" class="space-y-6">
|
||||
{{-- Client Selection --}}
|
||||
<flux:field>
|
||||
<flux:label class="required">{{ __('timelines.select_client') }}</flux:label>
|
||||
|
||||
@if($selectedUser)
|
||||
<div class="flex items-center gap-3 rounded-lg border border-zinc-200 bg-zinc-50 p-3 dark:border-zinc-700 dark:bg-zinc-900">
|
||||
<div class="flex items-center gap-3 rounded-lg border border-zinc-200 bg-zinc-50 p-3 ">
|
||||
<flux:avatar size="sm" name="{{ $selectedUser->full_name }}" />
|
||||
<div class="flex-1">
|
||||
<div class="font-medium text-zinc-900 dark:text-zinc-100">{{ $selectedUser->full_name }}</div>
|
||||
<div class="text-sm text-zinc-500 dark:text-zinc-400">{{ $selectedUser->email }}</div>
|
||||
<div class="font-medium text-zinc-900 ">{{ $selectedUser->full_name }}</div>
|
||||
<div class="text-sm text-zinc-500 ">{{ $selectedUser->email }}</div>
|
||||
</div>
|
||||
<flux:button variant="ghost" size="sm" wire:click="clearSelection" icon="x-mark" />
|
||||
</div>
|
||||
@@ -141,29 +141,29 @@ new class extends Component {
|
||||
/>
|
||||
|
||||
@if(strlen($search) >= 2)
|
||||
<div class="absolute z-10 mt-1 w-full rounded-lg border border-zinc-200 bg-white shadow-lg dark:border-zinc-700 dark:bg-zinc-800">
|
||||
<div class="absolute z-10 mt-1 w-full rounded-lg border border-zinc-200 bg-white shadow-lg ">
|
||||
@forelse($this->clients as $client)
|
||||
<button
|
||||
type="button"
|
||||
wire:key="client-{{ $client->id }}"
|
||||
wire:click="selectUser({{ $client->id }})"
|
||||
class="flex w-full items-center gap-3 px-4 py-3 text-start hover:bg-zinc-50 dark:hover:bg-zinc-700 first:rounded-t-lg last:rounded-b-lg"
|
||||
class="flex w-full items-center gap-3 px-4 py-3 text-start hover:bg-zinc-50 first:rounded-t-lg last:rounded-b-lg"
|
||||
>
|
||||
<flux:avatar size="sm" name="{{ $client->full_name }}" />
|
||||
<div>
|
||||
<div class="font-medium text-zinc-900 dark:text-zinc-100">{{ $client->full_name }}</div>
|
||||
<div class="text-sm text-zinc-500 dark:text-zinc-400">{{ $client->email }}</div>
|
||||
<div class="font-medium text-zinc-900 ">{{ $client->full_name }}</div>
|
||||
<div class="text-sm text-zinc-500 ">{{ $client->email }}</div>
|
||||
</div>
|
||||
</button>
|
||||
@empty
|
||||
<div class="px-4 py-3 text-sm text-zinc-500 dark:text-zinc-400">
|
||||
<div class="px-4 py-3 text-sm text-zinc-500 ">
|
||||
{{ __('timelines.no_clients_found') }}
|
||||
</div>
|
||||
@endforelse
|
||||
</div>
|
||||
@elseif(strlen($search) > 0 && strlen($search) < 2)
|
||||
<div class="absolute z-10 mt-1 w-full rounded-lg border border-zinc-200 bg-white p-3 shadow-lg dark:border-zinc-700 dark:bg-zinc-800">
|
||||
<div class="text-sm text-zinc-500 dark:text-zinc-400">
|
||||
<div class="absolute z-10 mt-1 w-full rounded-lg border border-zinc-200 bg-white p-3 shadow-lg ">
|
||||
<div class="text-sm text-zinc-500 ">
|
||||
{{ __('timelines.type_to_search') }}
|
||||
</div>
|
||||
</div>
|
||||
@@ -210,7 +210,7 @@ new class extends Component {
|
||||
<flux:error name="initialNotes" />
|
||||
</flux:field>
|
||||
|
||||
<div class="flex items-center justify-end gap-4 border-t border-zinc-200 pt-6 dark:border-zinc-700">
|
||||
<div class="flex items-center justify-end gap-4 border-t border-zinc-200 pt-6 ">
|
||||
<flux:button variant="ghost" :href="route('admin.dashboard')" wire:navigate>
|
||||
{{ __('timelines.cancel') }}
|
||||
</flux:button>
|
||||
|
||||
@@ -196,11 +196,11 @@ new class extends Component {
|
||||
<div class="mb-6 flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
|
||||
<div>
|
||||
<flux:heading size="xl">{{ __('export.export_timelines') }}</flux:heading>
|
||||
<flux:text class="mt-1 text-zinc-500 dark:text-zinc-400">{{ __('export.export_timelines_description') }}</flux:text>
|
||||
<flux:text class="mt-1 text-zinc-500">{{ __('export.export_timelines_description') }}</flux:text>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-6 rounded-lg border border-zinc-200 bg-white p-6 dark:border-zinc-700 dark:bg-zinc-800">
|
||||
<div class="mb-6 rounded-lg border border-zinc-200 bg-white p-6">
|
||||
<flux:heading size="lg" class="mb-4">{{ __('export.filters_applied') }}</flux:heading>
|
||||
|
||||
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4">
|
||||
@@ -217,19 +217,19 @@ new class extends Component {
|
||||
<button
|
||||
wire:click="clearClient"
|
||||
type="button"
|
||||
class="absolute end-2 top-8 text-zinc-400 hover:text-zinc-600 dark:hover:text-zinc-300"
|
||||
class="absolute end-2 top-8 text-zinc-400 hover:text-zinc-600"
|
||||
>
|
||||
<flux:icon name="x-mark" class="h-4 w-4" />
|
||||
</button>
|
||||
@endif
|
||||
|
||||
@if (strlen($clientSearch) >= 2 && ! $clientId && $this->clients->count() > 0)
|
||||
<div class="absolute z-10 mt-1 w-full rounded-lg border border-zinc-200 bg-white shadow-lg dark:border-zinc-700 dark:bg-zinc-800">
|
||||
<div class="absolute z-10 mt-1 w-full rounded-lg border border-zinc-200 bg-white shadow-lg">
|
||||
@foreach ($this->clients as $client)
|
||||
<button
|
||||
wire:click="selectClient({{ $client->id }})"
|
||||
type="button"
|
||||
class="block w-full px-4 py-2 text-start hover:bg-zinc-100 dark:hover:bg-zinc-700"
|
||||
class="block w-full px-4 py-2 text-start hover:bg-zinc-100"
|
||||
>
|
||||
<span class="font-medium">{{ $client->full_name }}</span>
|
||||
<span class="text-sm text-zinc-500">{{ $client->email }}</span>
|
||||
@@ -273,7 +273,7 @@ new class extends Component {
|
||||
wire:model.live="includeUpdates"
|
||||
:label="__('export.include_updates')"
|
||||
/>
|
||||
<flux:text class="ms-6 text-sm text-zinc-500 dark:text-zinc-400">
|
||||
<flux:text class="ms-6 text-sm text-zinc-500">
|
||||
{{ __('export.include_updates_description') }}
|
||||
</flux:text>
|
||||
</div>
|
||||
@@ -287,11 +287,11 @@ new class extends Component {
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="rounded-lg border border-zinc-200 bg-white p-6 dark:border-zinc-700 dark:bg-zinc-800">
|
||||
<div class="rounded-lg border border-zinc-200 bg-white p-6">
|
||||
<div class="flex flex-col items-center justify-between gap-4 sm:flex-row">
|
||||
<div>
|
||||
<flux:text class="text-zinc-600 dark:text-zinc-400">
|
||||
{{ __('export.total_records') }}: <span class="font-semibold text-zinc-900 dark:text-zinc-100">{{ $previewCount }}</span>
|
||||
<flux:text class="text-zinc-600">
|
||||
{{ __('export.total_records') }}: <span class="font-semibold text-zinc-900">{{ $previewCount }}</span>
|
||||
</flux:text>
|
||||
</div>
|
||||
|
||||
@@ -323,9 +323,9 @@ new class extends Component {
|
||||
</div>
|
||||
|
||||
@if ($previewCount === 0)
|
||||
<div class="mt-6 rounded-lg bg-zinc-50 p-8 text-center dark:bg-zinc-900">
|
||||
<div class="mt-6 rounded-lg bg-zinc-50 p-8 text-center">
|
||||
<flux:icon name="clock" class="mx-auto mb-4 h-12 w-12 text-zinc-400" />
|
||||
<flux:text class="text-zinc-500 dark:text-zinc-400">{{ __('export.no_timelines_match') }}</flux:text>
|
||||
<flux:text class="text-zinc-500">{{ __('export.no_timelines_match') }}</flux:text>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
@@ -125,7 +125,7 @@ new class extends Component
|
||||
<div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 mb-6">
|
||||
<div>
|
||||
<flux:heading size="xl">{{ __('timelines.timelines') }}</flux:heading>
|
||||
<p class="text-sm text-zinc-500 dark:text-zinc-400 mt-1">{{ __('timelines.timelines_description') }}</p>
|
||||
<p class="text-sm text-zinc-500 mt-1">{{ __('timelines.timelines_description') }}</p>
|
||||
</div>
|
||||
<div class="flex gap-2">
|
||||
<flux:button href="{{ route('admin.timelines.export') }}" icon="arrow-down-tray" wire:navigate>
|
||||
@@ -150,7 +150,7 @@ new class extends Component
|
||||
@endif
|
||||
|
||||
<!-- Filters -->
|
||||
<div class="bg-white dark:bg-zinc-800 rounded-lg p-4 border border-zinc-200 dark:border-zinc-700 mb-6">
|
||||
<div class="bg-white rounded-lg p-4 border border-zinc-200 mb-6">
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 mb-4">
|
||||
<flux:field>
|
||||
<flux:input
|
||||
@@ -208,27 +208,27 @@ new class extends Component
|
||||
</div>
|
||||
|
||||
<!-- Sort Headers -->
|
||||
<div class="hidden lg:flex bg-zinc-100 dark:bg-zinc-700 rounded-t-lg px-4 py-2 text-sm font-medium text-zinc-600 dark:text-zinc-300 gap-4 mb-0">
|
||||
<button wire:click="sort('case_name')" class="flex items-center gap-1 flex-1 hover:text-zinc-900 dark:hover:text-white">
|
||||
<div class="hidden lg:flex bg-zinc-100 rounded-t-lg px-4 py-2 text-sm font-medium text-zinc-600 gap-4 mb-0">
|
||||
<button wire:click="sort('case_name')" class="flex items-center gap-1 flex-1 hover:text-zinc-900">
|
||||
{{ __('timelines.case_name') }}
|
||||
@if($sortBy === 'case_name')
|
||||
<flux:icon name="{{ $sortDir === 'asc' ? 'chevron-up' : 'chevron-down' }}" class="w-4 h-4" />
|
||||
@endif
|
||||
</button>
|
||||
<button wire:click="sort('user_id')" class="flex items-center gap-1 w-40 hover:text-zinc-900 dark:hover:text-white">
|
||||
<button wire:click="sort('user_id')" class="flex items-center gap-1 w-40 hover:text-zinc-900">
|
||||
{{ __('admin.client') }}
|
||||
@if($sortBy === 'user_id')
|
||||
<flux:icon name="{{ $sortDir === 'asc' ? 'chevron-up' : 'chevron-down' }}" class="w-4 h-4" />
|
||||
@endif
|
||||
</button>
|
||||
<span class="w-24">{{ __('admin.current_status') }}</span>
|
||||
<button wire:click="sort('updated_at')" class="flex items-center gap-1 w-32 hover:text-zinc-900 dark:hover:text-white">
|
||||
<button wire:click="sort('updated_at')" class="flex items-center gap-1 w-32 hover:text-zinc-900">
|
||||
{{ __('timelines.last_updated') }}
|
||||
@if($sortBy === 'updated_at')
|
||||
<flux:icon name="{{ $sortDir === 'asc' ? 'chevron-up' : 'chevron-down' }}" class="w-4 h-4" />
|
||||
@endif
|
||||
</button>
|
||||
<button wire:click="sort('created_at')" class="flex items-center gap-1 w-32 hover:text-zinc-900 dark:hover:text-white">
|
||||
<button wire:click="sort('created_at')" class="flex items-center gap-1 w-32 hover:text-zinc-900">
|
||||
{{ __('timelines.created') }}
|
||||
@if($sortBy === 'created_at')
|
||||
<flux:icon name="{{ $sortDir === 'asc' ? 'chevron-up' : 'chevron-down' }}" class="w-4 h-4" />
|
||||
@@ -241,15 +241,15 @@ new class extends Component
|
||||
<!-- Timelines List -->
|
||||
<div class="space-y-0">
|
||||
@forelse($timelines as $timeline)
|
||||
<div wire:key="timeline-{{ $timeline->id }}" class="bg-white dark:bg-zinc-800 p-4 border border-zinc-200 dark:border-zinc-700 {{ $loop->first ? 'rounded-t-lg lg:rounded-t-none' : '' }} {{ $loop->last ? 'rounded-b-lg' : '' }} {{ !$loop->first ? 'border-t-0' : '' }}">
|
||||
<div wire:key="timeline-{{ $timeline->id }}" class="bg-white p-4 border border-zinc-200 {{ $loop->first ? 'rounded-t-lg lg:rounded-t-none' : '' }} {{ $loop->last ? 'rounded-b-lg' : '' }} {{ !$loop->first ? 'border-t-0' : '' }}">
|
||||
<div class="flex flex-col lg:flex-row lg:items-center gap-4">
|
||||
<!-- Case Name -->
|
||||
<div class="flex-1">
|
||||
<a href="{{ route('admin.timelines.show', $timeline) }}" class="font-semibold text-zinc-900 dark:text-zinc-100 hover:text-blue-600 dark:hover:text-blue-400" wire:navigate>
|
||||
<a href="{{ route('admin.timelines.show', $timeline) }}" class="font-semibold text-zinc-900 hover:text-blue-600" wire:navigate>
|
||||
{{ $timeline->case_name }}
|
||||
</a>
|
||||
@if($timeline->case_reference)
|
||||
<div class="text-xs text-zinc-500 dark:text-zinc-400 mt-1">
|
||||
<div class="text-xs text-zinc-500 mt-1">
|
||||
{{ __('timelines.reference') }}: {{ $timeline->case_reference }}
|
||||
</div>
|
||||
@endif
|
||||
@@ -257,10 +257,10 @@ new class extends Component
|
||||
|
||||
<!-- Client -->
|
||||
<div class="lg:w-40">
|
||||
<div class="text-sm text-zinc-900 dark:text-zinc-100">
|
||||
<div class="text-sm text-zinc-900">
|
||||
{{ $timeline->user->full_name }}
|
||||
</div>
|
||||
<div class="text-xs text-zinc-500 dark:text-zinc-400">
|
||||
<div class="text-xs text-zinc-500">
|
||||
{{ $timeline->user->email }}
|
||||
</div>
|
||||
</div>
|
||||
@@ -274,14 +274,14 @@ new class extends Component
|
||||
|
||||
<!-- Last Updated -->
|
||||
<div class="lg:w-32">
|
||||
<div class="text-sm text-zinc-900 dark:text-zinc-100">
|
||||
<div class="text-sm text-zinc-900">
|
||||
{{ $timeline->updated_at->diffForHumans() }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Created -->
|
||||
<div class="lg:w-32">
|
||||
<div class="text-sm text-zinc-500 dark:text-zinc-400">
|
||||
<div class="text-sm text-zinc-500">
|
||||
{{ $timeline->created_at->format('Y-m-d') }}
|
||||
</div>
|
||||
</div>
|
||||
@@ -342,7 +342,7 @@ new class extends Component
|
||||
</div>
|
||||
</div>
|
||||
@empty
|
||||
<div class="text-center py-12 text-zinc-500 dark:text-zinc-400 bg-white dark:bg-zinc-800 rounded-lg border border-zinc-200 dark:border-zinc-700">
|
||||
<div class="text-center py-12 text-zinc-500 bg-white rounded-lg border border-zinc-200">
|
||||
<flux:icon name="inbox" class="w-12 h-12 mx-auto mb-4" />
|
||||
<p>{{ __('timelines.no_timelines') }}</p>
|
||||
</div>
|
||||
|
||||
@@ -157,12 +157,12 @@ new class extends Component {
|
||||
</div>
|
||||
|
||||
{{-- Timeline Header --}}
|
||||
<div class="mb-6 rounded-lg border border-zinc-200 bg-white p-6 dark:border-zinc-700 dark:bg-zinc-800 {{ $timeline->isArchived() ? 'opacity-75' : '' }}">
|
||||
<div class="mb-6 rounded-lg border border-zinc-200 bg-white p-6 {{ $timeline->isArchived() ? 'opacity-75' : '' }}">
|
||||
<div class="flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between">
|
||||
<div>
|
||||
<flux:heading size="xl">{{ $timeline->case_name }}</flux:heading>
|
||||
@if($timeline->case_reference)
|
||||
<div class="mt-1 text-sm text-zinc-500 dark:text-zinc-400">
|
||||
<div class="mt-1 text-sm text-zinc-500 ">
|
||||
{{ __('timelines.reference') }}: {{ $timeline->case_reference }}
|
||||
</div>
|
||||
@endif
|
||||
@@ -185,7 +185,7 @@ new class extends Component {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-4 flex flex-wrap gap-4 text-sm text-zinc-600 dark:text-zinc-300">
|
||||
<div class="mt-4 flex flex-wrap gap-4 text-sm text-zinc-600 ">
|
||||
<div class="flex items-center gap-2">
|
||||
<flux:icon.user class="size-4" />
|
||||
<span>{{ $timeline->user->full_name }}</span>
|
||||
@@ -219,7 +219,7 @@ new class extends Component {
|
||||
@endif
|
||||
|
||||
{{-- Add Update Form --}}
|
||||
<div class="mb-6 rounded-lg border border-zinc-200 bg-white p-6 dark:border-zinc-700 dark:bg-zinc-800 {{ $timeline->isArchived() ? 'opacity-60' : '' }}">
|
||||
<div class="mb-6 rounded-lg border border-zinc-200 bg-white p-6 {{ $timeline->isArchived() ? 'opacity-60' : '' }}">
|
||||
<flux:heading size="lg" class="mb-4">{{ __('timelines.add_update') }}</flux:heading>
|
||||
|
||||
@if($timeline->isArchived())
|
||||
@@ -258,34 +258,34 @@ new class extends Component {
|
||||
</div>
|
||||
|
||||
{{-- Timeline Updates --}}
|
||||
<div class="rounded-lg border border-zinc-200 bg-white p-6 dark:border-zinc-700 dark:bg-zinc-800">
|
||||
<div class="rounded-lg border border-zinc-200 bg-white p-6 ">
|
||||
<flux:heading size="lg" class="mb-6">{{ __('timelines.updates_history') }}</flux:heading>
|
||||
|
||||
@if($timeline->updates->isEmpty())
|
||||
<div class="text-center py-8 text-zinc-500 dark:text-zinc-400">
|
||||
<div class="text-center py-8 text-zinc-500 ">
|
||||
{{ __('timelines.no_updates') }}
|
||||
</div>
|
||||
@else
|
||||
<div class="relative">
|
||||
{{-- Timeline line --}}
|
||||
<div class="absolute start-4 top-0 bottom-0 w-0.5 bg-zinc-200 dark:bg-zinc-700"></div>
|
||||
<div class="absolute start-4 top-0 bottom-0 w-0.5 bg-zinc-200 "></div>
|
||||
|
||||
<div class="space-y-6">
|
||||
@foreach($timeline->updates as $update)
|
||||
<div wire:key="update-{{ $update->id }}" class="relative flex gap-4">
|
||||
{{-- Timeline dot --}}
|
||||
<div class="relative z-10 flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-blue-100 dark:bg-blue-900">
|
||||
<flux:icon.document-text class="size-4 text-blue-600 dark:text-blue-400" />
|
||||
<div class="relative z-10 flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-blue-100 ">
|
||||
<flux:icon.document-text class="size-4 text-blue-600 " />
|
||||
</div>
|
||||
|
||||
{{-- Update content --}}
|
||||
<div class="flex-1 rounded-lg border border-zinc-200 bg-zinc-50 p-4 dark:border-zinc-700 dark:bg-zinc-900">
|
||||
<div class="flex-1 rounded-lg border border-zinc-200 bg-zinc-50 p-4 ">
|
||||
<div class="mb-2 flex flex-wrap items-center justify-between gap-2">
|
||||
<div class="flex flex-wrap items-center gap-3 text-sm">
|
||||
<span class="font-medium text-zinc-900 dark:text-zinc-100">
|
||||
<span class="font-medium text-zinc-900 ">
|
||||
{{ $update->admin->full_name }}
|
||||
</span>
|
||||
<span class="text-zinc-500 dark:text-zinc-400">
|
||||
<span class="text-zinc-500 ">
|
||||
{{ $update->created_at->format('Y-m-d H:i') }}
|
||||
</span>
|
||||
@if($update->updated_at->gt($update->created_at))
|
||||
@@ -307,7 +307,7 @@ new class extends Component {
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="prose prose-sm dark:prose-invert max-w-none">
|
||||
<div class="prose prose-sm max-w-none">
|
||||
{!! $update->update_text !!}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user