fixed invisible buttons issue across the website

This commit is contained in:
Naser Mansour
2026-01-09 19:32:10 +02:00
parent 80072eae56
commit 773e1d3f7f
39 changed files with 155 additions and 155 deletions
@@ -236,7 +236,7 @@ new class extends Component {
@if ($consultationType !== 'all' || $status !== 'all' || $paymentStatus !== 'all' || $dateFrom || $dateTo)
<div class="mt-4">
<flux:button wire:click="clearFilters" variant="ghost" icon="x-mark" size="sm">
<flux:button wire:click="clearFilters" variant="outline" icon="x-mark" size="sm">
{{ __('export.clear_filters') }}
</flux:button>
</div>
@@ -268,7 +268,7 @@ new class extends Component {
wire:click="exportPdf"
wire:loading.attr="disabled"
wire:target="exportCsv,exportPdf"
variant="filled"
variant="outline"
icon="document-text"
class="!bg-zinc-700 !text-white hover:!bg-zinc-800"
:disabled="$previewCount === 0"
@@ -282,7 +282,7 @@ new class extends Component
</flux:field>
@if($search || $statusFilter || $typeFilter || $paymentFilter || $dateFrom || $dateTo)
<flux:button wire:click="clearFilters" variant="ghost">
<flux:button wire:click="clearFilters" variant="outline">
{{ __('common.clear') }}
</flux:button>
@endif
@@ -329,7 +329,7 @@ new class extends Component
<a href="{{ route('admin.consultations.show', $consultation) }}" class="font-semibold text-zinc-900 hover:text-blue-600" wire:navigate>
{{ $consultation->user?->full_name ?? __('common.unknown') }}
</a>
<flux:badge size="sm" variant="{{ $consultation->consultation_type === \App\Enums\ConsultationType::Paid ? 'primary' : 'outline' }}">
<flux:badge size="sm" color="{{ $consultation->consultation_type === \App\Enums\ConsultationType::Paid ? 'indigo' : 'zinc' }}">
{{ $consultation->consultation_type->label() }}
</flux:badge>
</div>
@@ -341,16 +341,16 @@ new class extends Component
<!-- Status Badge -->
<div class="lg:w-24">
@php
$statusVariant = match($consultation->status) {
\App\Enums\ConsultationStatus::Pending => 'warning',
\App\Enums\ConsultationStatus::Approved => 'primary',
\App\Enums\ConsultationStatus::Completed => 'success',
\App\Enums\ConsultationStatus::Cancelled => 'danger',
\App\Enums\ConsultationStatus::NoShow => 'danger',
\App\Enums\ConsultationStatus::Rejected => 'danger',
$statusColor = match($consultation->status) {
\App\Enums\ConsultationStatus::Pending => 'amber',
\App\Enums\ConsultationStatus::Approved => 'sky',
\App\Enums\ConsultationStatus::Completed => 'green',
\App\Enums\ConsultationStatus::Cancelled => 'red',
\App\Enums\ConsultationStatus::NoShow => 'orange',
\App\Enums\ConsultationStatus::Rejected => 'rose',
};
@endphp
<flux:badge variant="{{ $statusVariant }}" size="sm">
<flux:badge color="{{ $statusColor }}" size="sm">
{{ $consultation->status->label() }}
</flux:badge>
</div>
@@ -359,13 +359,13 @@ new class extends Component
<div class="lg:w-24">
@if($consultation->consultation_type === \App\Enums\ConsultationType::Paid)
@php
$paymentVariant = match($consultation->payment_status) {
\App\Enums\PaymentStatus::Pending => 'warning',
\App\Enums\PaymentStatus::Received => 'success',
default => 'outline',
$paymentColor = match($consultation->payment_status) {
\App\Enums\PaymentStatus::Pending => 'amber',
\App\Enums\PaymentStatus::Received => 'green',
default => 'zinc',
};
@endphp
<flux:badge variant="{{ $paymentVariant }}" size="sm">
<flux:badge color="{{ $paymentColor }}" size="sm">
{{ $consultation->payment_status->label() }}
</flux:badge>
@else
@@ -377,7 +377,7 @@ new class extends Component
<div class="lg:w-48 flex flex-wrap gap-2">
<flux:button
href="{{ route('admin.consultations.show', $consultation) }}"
variant="filled"
variant="outline"
size="sm"
wire:navigate
>
@@ -386,7 +386,7 @@ new class extends Component
@if($consultation->status === \App\Enums\ConsultationStatus::Approved)
<flux:dropdown>
<flux:button variant="ghost" size="sm" icon="ellipsis-vertical" />
<flux:button variant="outline" size="sm" icon="ellipsis-vertical" />
<flux:menu>
<flux:menu.item
@@ -311,7 +311,7 @@ new class extends Component
<div class="max-w-5xl mx-auto">
<div class="mb-6">
<flux:button href="{{ route('admin.consultations.index') }}" variant="ghost" icon="arrow-left" wire:navigate>
<flux:button href="{{ route('admin.consultations.index') }}" variant="outline" icon="arrow-left" wire:navigate>
{{ __('common.back') }}
</flux:button>
</div>
@@ -321,7 +321,7 @@ new class extends Component
@if($consultation->status === \App\Enums\ConsultationStatus::Approved)
<div class="flex gap-2">
<flux:button wire:click="openRescheduleModal" variant="filled" icon="calendar">
<flux:button wire:click="openRescheduleModal" variant="outline" icon="calendar">
{{ __('admin.reschedule') }}
</flux:button>
</div>
@@ -370,16 +370,16 @@ new class extends Component
<dt class="text-sm text-zinc-500">{{ __('admin.current_status') }}</dt>
<dd>
@php
$statusVariant = match($consultation->status) {
\App\Enums\ConsultationStatus::Pending => 'warning',
\App\Enums\ConsultationStatus::Approved => 'primary',
\App\Enums\ConsultationStatus::Completed => 'success',
\App\Enums\ConsultationStatus::Cancelled => 'danger',
\App\Enums\ConsultationStatus::NoShow => 'danger',
\App\Enums\ConsultationStatus::Rejected => 'danger',
$statusColor = match($consultation->status) {
\App\Enums\ConsultationStatus::Pending => 'amber',
\App\Enums\ConsultationStatus::Approved => 'sky',
\App\Enums\ConsultationStatus::Completed => 'green',
\App\Enums\ConsultationStatus::Cancelled => 'red',
\App\Enums\ConsultationStatus::NoShow => 'orange',
\App\Enums\ConsultationStatus::Rejected => 'rose',
};
@endphp
<flux:badge variant="{{ $statusVariant }}">
<flux:badge color="{{ $statusColor }}">
{{ $consultation->status->label() }}
</flux:badge>
</dd>
@@ -387,7 +387,7 @@ new class extends Component
<div>
<dt class="text-sm text-zinc-500">{{ __('admin.consultation_type') }}</dt>
<dd>
<flux:badge variant="{{ $consultation->consultation_type === \App\Enums\ConsultationType::Paid ? 'primary' : 'outline' }}">
<flux:badge color="{{ $consultation->consultation_type === \App\Enums\ConsultationType::Paid ? 'indigo' : 'zinc' }}">
{{ $consultation->consultation_type->label() }}
</flux:badge>
</dd>
@@ -430,13 +430,13 @@ new class extends Component
<dt class="text-sm text-zinc-500">{{ __('admin.payment_status') }}</dt>
<dd>
@php
$paymentVariant = match($consultation->payment_status) {
\App\Enums\PaymentStatus::Pending => 'warning',
\App\Enums\PaymentStatus::Received => 'success',
default => 'outline',
$paymentColor = match($consultation->payment_status) {
\App\Enums\PaymentStatus::Pending => 'amber',
\App\Enums\PaymentStatus::Received => 'green',
default => 'zinc',
};
@endphp
<flux:badge variant="{{ $paymentVariant }}">
<flux:badge color="{{ $paymentColor }}">
{{ $consultation->payment_status->label() }}
</flux:badge>
</dd>
@@ -491,7 +491,7 @@ new class extends Component
@enderror
</flux:field>
<div class="mt-2 flex gap-2 justify-end">
<flux:button wire:click="cancelEditNote" variant="ghost" size="sm">
<flux:button wire:click="cancelEditNote" variant="outline" size="sm">
{{ __('common.cancel') }}
</flux:button>
<flux:button wire:click="updateNote" variant="primary" size="sm">
@@ -510,7 +510,7 @@ new class extends Component
<span>{{ \Carbon\Carbon::parse($note['created_at'])->translatedFormat('d M Y, g:i A') }}</span>
</div>
<div class="mt-2 flex gap-2 justify-end">
<flux:button wire:click="startEditNote({{ $index }})" variant="ghost" size="sm">
<flux:button wire:click="startEditNote({{ $index }})" variant="outline" size="sm">
{{ __('common.edit') }}
</flux:button>
<flux:button
@@ -560,7 +560,7 @@ new class extends Component
<div class="mt-4 pt-4 border-t border-zinc-200">
<flux:button
href="{{ route('admin.clients.consultation-history', $consultation->user) }}"
variant="ghost"
variant="outline"
size="sm"
class="w-full"
wire:navigate
@@ -582,7 +582,7 @@ new class extends Component
<flux:button
wire:click="markCompleted"
wire:confirm="{{ __('admin.confirm_mark_completed') }}"
variant="filled"
variant="outline"
class="w-full"
icon="check-circle"
>
@@ -592,7 +592,7 @@ new class extends Component
<flux:button
wire:click="markNoShow"
wire:confirm="{{ __('admin.confirm_mark_no_show') }}"
variant="ghost"
variant="outline"
class="w-full"
icon="x-circle"
>
@@ -672,7 +672,7 @@ new class extends Component
</div>
<div class="mt-6 flex gap-2 justify-end">
<flux:button wire:click="closeRescheduleModal" variant="ghost">
<flux:button wire:click="closeRescheduleModal" variant="outline">
{{ __('common.cancel') }}
</flux:button>
<flux:button wire:click="reschedule" variant="primary" :disabled="!$newDate || !$newTime">