Unify Frontdesk secondary actions with shared button variants.
Deploy Ladill Frontdesk / deploy (push) Successful in 55s

Add warning, danger, and link button styles plus x-btn and x-danger-zone components so ghost text actions match the primary pill UI across edit screens and tables.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
isaacclad
2026-07-09 06:28:27 +00:00
co-authored by Cursor
parent 60c2839553
commit f46bebc1e3
26 changed files with 257 additions and 73 deletions
+113
View File
@@ -167,6 +167,119 @@ html.qr-mobile-page body {
pointer-events: none;
}
.btn-warning {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
border-radius: 9999px;
border: 1px solid rgb(252 211 77);
background-color: #fff;
padding: 0.5rem 1rem;
font-size: 0.875rem;
line-height: 1.25rem;
font-weight: 600;
color: rgb(180 83 9);
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
transition: background-color 0.15s ease, border-color 0.15s ease;
}
.btn-warning:hover {
background-color: rgb(255 251 235);
border-color: rgb(245 158 11);
}
.btn-warning:disabled {
opacity: 0.6;
pointer-events: none;
}
.btn-danger {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
border-radius: 9999px;
border: 1px solid rgb(254 202 202);
background-color: #fff;
padding: 0.5rem 1rem;
font-size: 0.875rem;
line-height: 1.25rem;
font-weight: 600;
color: rgb(185 28 28);
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
transition: background-color 0.15s ease, border-color 0.15s ease;
}
.btn-danger:hover {
background-color: rgb(254 242 242);
border-color: rgb(252 165 165);
}
.btn-danger:disabled {
opacity: 0.6;
pointer-events: none;
}
.btn-danger-plain {
padding: 0;
border: none;
background: transparent;
border-radius: 0;
box-shadow: none;
font-weight: 500;
}
.btn-danger-plain:hover {
background: transparent;
text-decoration: underline;
}
.btn-link {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.375rem;
border-radius: 9999px;
border: 1px solid transparent;
background-color: transparent;
padding: 0.5rem 0.75rem;
font-size: 0.875rem;
line-height: 1.25rem;
font-weight: 600;
color: rgb(67 56 202);
transition: background-color 0.15s ease, color 0.15s ease;
}
.btn-link:hover {
background-color: rgb(238 242 255);
color: rgb(55 48 163);
}
.btn-link:disabled {
opacity: 0.6;
pointer-events: none;
}
.btn-link-plain {
padding: 0;
border: none;
background: transparent;
border-radius: 0;
font-weight: 500;
}
.btn-link-plain:hover {
background: transparent;
text-decoration: underline;
}
.btn-sm {
padding: 0.25rem 0.625rem;
font-size: 0.75rem;
line-height: 1rem;
}
.btn-group {
display: flex;
flex-wrap: wrap;
+34
View File
@@ -0,0 +1,34 @@
@props([
'variant' => 'primary',
'href' => null,
'type' => 'button',
'size' => null,
'plain' => false,
])
@php
$tag = $href ? 'a' : 'button';
$variantClass = match ($variant) {
'secondary' => 'btn-secondary',
'warning' => 'btn-warning',
'danger' => 'btn-danger',
'link' => 'btn-link',
default => 'btn-primary',
};
$classes = collect([
$variantClass,
$size === 'sm' ? 'btn-sm' : null,
($plain && $variant === 'link') ? 'btn-link-plain' : null,
($plain && $variant === 'danger') ? 'btn-danger-plain' : null,
])->filter()->implode(' ');
@endphp
<{{ $tag }}
@if ($href) href="{{ $href }}" @endif
@if ($tag === 'button') type="{{ $type }}" @endif
{{ $attributes->class([$classes]) }}
>
{{ $slot }}
</{{ $tag }}>
@@ -0,0 +1,12 @@
@props([
'title' => null,
])
<div {{ $attributes->class(['mt-6 space-y-3 rounded-2xl border border-slate-200 bg-slate-50/80 p-4']) }}>
@if ($title)
<p class="text-xs font-semibold uppercase tracking-wide text-slate-500">{{ $title }}</p>
@endif
<div class="flex flex-col items-start gap-2 sm:flex-row sm:flex-wrap sm:gap-3">
{{ $slot }}
</div>
</div>
@@ -37,7 +37,7 @@
<p class="text-sm text-slate-500">{{ $branch->address ?? 'No address' }} · {{ $branch->buildings_count }} building(s)</p>
</div>
<div class="flex gap-2">
<a href="{{ route('frontdesk.buildings.index', $branch) }}" class="text-sm text-indigo-600 hover:text-indigo-700">Buildings</a>
<x-btn href="{{ route('frontdesk.buildings.index', $branch) }}" variant="link" size="sm" plain>Buildings</x-btn>
<a href="{{ route('frontdesk.branches.edit', $branch) }}" class="text-sm text-slate-600 hover:text-slate-800">Edit</a>
</div>
</div>
@@ -1,7 +1,7 @@
<x-app-layout :title="$branch->name.' buildings'">
<div class="flex items-center justify-between">
<div>
<a href="{{ route('frontdesk.branches.index') }}" class="text-sm text-indigo-600"> Branches</a>
<x-btn href="{{ route('frontdesk.branches.index') }}" variant="link" size="sm" plain> Branches</x-btn>
<h1 class="mt-1 text-xl font-semibold text-slate-900">{{ $branch->name }}</h1>
</div>
</div>
@@ -20,11 +20,11 @@
<p class="font-medium">{{ $building->name }}</p>
<p class="text-xs text-slate-500">{{ $building->reception_desks_count }} desk(s)</p>
</div>
<div class="flex gap-3">
<a href="{{ route('frontdesk.desks.index', $building) }}" class="text-sm text-indigo-600">Desks</a>
<div class="btn-group">
<x-btn href="{{ route('frontdesk.desks.index', $building) }}" variant="link" size="sm" plain>Desks</x-btn>
<form method="POST" action="{{ route('frontdesk.buildings.destroy', [$branch, $building]) }}" onsubmit="return confirm('Remove this building?')">
@csrf @method('DELETE')
<button type="submit" class="text-sm text-red-600">Remove</button>
<x-btn type="submit" variant="danger" size="sm">Remove</x-btn>
</form>
</div>
</div>
@@ -1,5 +1,5 @@
<x-app-layout :title="$building->name.' desks'">
<a href="{{ route('frontdesk.buildings.index', $building->branch) }}" class="text-sm text-indigo-600"> Buildings</a>
<x-btn href="{{ route('frontdesk.buildings.index', $building->branch) }}" variant="link" size="sm" plain class="mb-1"> Buildings</x-btn>
<h1 class="mt-1 text-xl font-semibold text-slate-900">{{ $building->name }}</h1>
<form method="POST" action="{{ route('frontdesk.desks.store', $building) }}" class="mt-6 flex gap-2 rounded-2xl border border-slate-200 bg-white p-4">
@@ -18,7 +18,7 @@
</div>
<form method="POST" action="{{ route('frontdesk.desks.destroy', [$building, $desk]) }}" onsubmit="return confirm('Remove this desk?')">
@csrf @method('DELETE')
<button type="submit" class="text-sm text-red-600">Remove</button>
<x-btn type="submit" variant="danger" size="sm">Remove</x-btn>
</form>
</div>
@empty
@@ -40,7 +40,7 @@
@if ($member->user_ref !== auth()->user()->public_id)
<form method="POST" action="{{ route('frontdesk.members.destroy', $member) }}" class="inline" onsubmit="return confirm('Remove this member?')">
@csrf @method('DELETE')
<button type="submit" class="text-red-600">Remove</button>
<x-btn type="submit" variant="danger" size="sm">Remove</x-btn>
</form>
@endif
</td>
@@ -5,7 +5,7 @@
<p class="text-sm text-slate-500">Security and compliance activity</p>
</div>
@if ($canExport)
<a href="{{ route('frontdesk.audit.export', request()->query()) }}" class="rounded-lg border border-slate-200 px-4 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50">Export CSV</a>
<x-btn href="{{ route('frontdesk.audit.export', request()->query()) }}" variant="secondary" size="sm">Export CSV</x-btn>
@endif
</div>
@@ -19,7 +19,7 @@
</select>
<input type="date" name="from" value="{{ request('from') }}" class="rounded-lg border-slate-300 text-sm">
<input type="date" name="to" value="{{ request('to') }}" class="rounded-lg border-slate-300 text-sm">
<button type="submit" class="rounded-lg border border-slate-200 px-4 py-2 text-sm sm:col-span-4 sm:w-fit">Filter</button>
<x-btn type="submit" variant="secondary" size="sm" class="sm:col-span-4 sm:w-fit">Filter</x-btn>
</form>
<div class="mt-4 overflow-hidden rounded-2xl border border-slate-200 bg-white">
@@ -15,7 +15,7 @@
</div>
<form method="POST" action="{{ route('frontdesk.compliance.visitors.restore', $visitor->id) }}">
@csrf
<button type="submit" class="text-sm text-indigo-600 hover:text-indigo-800">Restore</button>
<x-btn type="submit" variant="link" size="sm">Restore</x-btn>
</form>
</div>
@empty
@@ -35,7 +35,7 @@
</div>
<form method="POST" action="{{ route('frontdesk.compliance.visits.restore', $visit->id) }}">
@csrf
<button type="submit" class="text-sm text-indigo-600 hover:text-indigo-800">Restore</button>
<x-btn type="submit" variant="link" size="sm">Restore</x-btn>
</form>
</div>
@empty
@@ -40,7 +40,14 @@
<p class="text-xs font-medium uppercase text-slate-500">Device token</p>
<code class="mt-1 block break-all text-xs text-slate-700">{{ $device->device_token }}</code>
@if ($device->type === 'kiosk')
<a href="{{ route('frontdesk.kiosk.device', $device->device_token) }}" target="_blank" class="mt-2 inline-block text-sm text-indigo-700 hover:underline">Open kiosk URL</a>
<x-btn
:href="route('frontdesk.kiosk.device', $device->device_token)"
target="_blank"
variant="link"
size="sm"
plain
class="mt-2"
>Open kiosk URL</x-btn>
@if (! empty($kioskQrSvg))
<div class="mt-4 rounded-xl border border-slate-200 bg-white p-4 text-center">
<p class="text-sm font-medium text-slate-900">Provision Ladill Kiosk app</p>
@@ -53,21 +60,33 @@
@endif
<div class="flex gap-3 pt-2">
<a href="{{ route('frontdesk.devices.index') }}" class="flex-1 rounded-lg border border-slate-200 py-2 text-center text-sm">Back</a>
<button type="submit" class="btn-primary flex-1">Save</button>
<x-btn href="{{ route('frontdesk.devices.index') }}" variant="secondary" class="flex-1 justify-center">Back</x-btn>
<x-btn type="submit" class="flex-1">Save</x-btn>
</div>
</form>
@if ($device->device_token)
<form method="POST" action="{{ route('frontdesk.devices.regenerate-token', $device) }}" class="mt-3">
@csrf
<button type="submit" class="text-sm text-amber-700 hover:underline" onclick="return confirm('Regenerate token? Existing kiosk sessions will stop working.')">Regenerate token</button>
<x-danger-zone title="Device actions" class="mt-4">
<form method="POST" action="{{ route('frontdesk.devices.regenerate-token', $device) }}" class="inline">
@csrf
<x-btn
type="submit"
variant="warning"
onclick="return confirm('Regenerate token? Existing kiosk sessions will stop working.')"
>Regenerate token</x-btn>
</form>
<form method="POST" action="{{ route('frontdesk.devices.destroy', $device) }}" class="inline" onsubmit="return confirm('Remove this device?')">
@csrf @method('DELETE')
<x-btn type="submit" variant="danger">Remove device</x-btn>
</form>
</x-danger-zone>
@else
<form method="POST" action="{{ route('frontdesk.devices.destroy', $device) }}" class="mt-4" onsubmit="return confirm('Remove this device?')">
@csrf @method('DELETE')
<x-danger-zone title="Device actions">
<x-btn type="submit" variant="danger">Remove device</x-btn>
</x-danger-zone>
</form>
@endif
<form method="POST" action="{{ route('frontdesk.devices.destroy', $device) }}" class="mt-4" onsubmit="return confirm('Remove this device?')">
@csrf @method('DELETE')
<button type="submit" class="text-sm text-red-600 hover:underline">Remove device</button>
</form>
</div>
</x-app-layout>
@@ -53,10 +53,18 @@
<td class="px-4 py-3 text-slate-500">{{ $device->last_online_at?->diffForHumans() ?? 'Never' }}</td>
<td class="px-4 py-3 text-right">
@if ($canManage)
<a href="{{ route('frontdesk.devices.edit', $device) }}" class="text-indigo-700 hover:underline">Edit</a>
@endif
@if ($device->type === 'kiosk' && $device->device_token)
<a href="{{ route('frontdesk.kiosk.device', $device->device_token) }}" target="_blank" class="ml-3 text-indigo-700 hover:underline">Open kiosk</a>
<div class="btn-group justify-end">
<x-btn href="{{ route('frontdesk.devices.edit', $device) }}" variant="link" size="sm" plain>Edit</x-btn>
@if ($device->type === 'kiosk' && $device->device_token)
<x-btn
:href="route('frontdesk.kiosk.device', $device->device_token)"
target="_blank"
variant="link"
size="sm"
plain
>Open kiosk</x-btn>
@endif
</div>
@endif
</td>
</tr>
@@ -51,7 +51,7 @@
<form method="POST" action="{{ route('frontdesk.employee.portal.action') }}" class="mt-3">
@csrf
<input type="hidden" name="action" value="sign_out">
<button type="submit" class="w-full rounded-lg border border-slate-200 py-2.5 text-sm font-medium text-slate-700">Sign out for the day</button>
<x-btn type="submit" variant="secondary" class="w-full">Sign out for the day</x-btn>
</form>
@endif
@@ -64,7 +64,7 @@
<form method="POST" action="{{ route('frontdesk.employee.portal.action') }}" class="mt-3">
@csrf
<input type="hidden" name="action" value="sign_out">
<button type="submit" class="w-full rounded-lg border border-slate-200 py-2.5 text-sm font-medium text-slate-700">Sign out for the day</button>
<x-btn type="submit" variant="secondary" class="w-full">Sign out for the day</x-btn>
</form>
@endif
</div>
@@ -64,13 +64,15 @@
</div>
@endif
<div class="flex gap-3 pt-2">
<a href="{{ route('frontdesk.employees.index') }}" class="flex-1 rounded-lg border border-slate-200 py-2 text-center text-sm">Back</a>
<button type="submit" class="btn-primary flex-1">Save</button>
<x-btn href="{{ route('frontdesk.employees.index') }}" variant="secondary" class="flex-1 justify-center">Back</x-btn>
<x-btn type="submit" class="flex-1">Save</x-btn>
</div>
</form>
<form method="POST" action="{{ route('frontdesk.employees.destroy', $employee) }}" class="mt-4" onsubmit="return confirm('Remove this employee?')">
<form method="POST" action="{{ route('frontdesk.employees.destroy', $employee) }}" onsubmit="return confirm('Remove this employee?')">
@csrf @method('DELETE')
<button type="submit" class="text-sm text-red-600 hover:underline">Remove employee</button>
<x-danger-zone title="Employee actions">
<x-btn type="submit" variant="danger">Remove employee</x-btn>
</x-danger-zone>
</form>
</div>
</x-app-layout>
@@ -55,7 +55,7 @@
</td>
<td class="px-4 py-3 text-right">
<a href="{{ route('frontdesk.employees.badge', $employee) }}" target="_blank" class="text-sm text-slate-600">Badge</a>
<a href="{{ route('frontdesk.employees.edit', $employee) }}" class="ml-3 text-sm text-indigo-600">Edit</a>
<x-btn href="{{ route('frontdesk.employees.edit', $employee) }}" variant="link" size="sm" plain class="ml-3">Edit</x-btn>
</td>
</tr>
@empty
@@ -7,9 +7,7 @@
<div class="flex flex-wrap gap-2">
<form method="POST" action="{{ route('frontdesk.host.availability') }}">
@csrf
<button type="submit" class="rounded-lg border border-slate-200 px-4 py-2 text-sm font-medium hover:bg-slate-50">
{{ $host->is_available ? 'Mark unavailable' : 'Mark available' }}
</button>
<x-btn type="submit" variant="secondary">{{ $host->is_available ? 'Mark unavailable' : 'Mark available' }}</x-btn>
</form>
<a href="{{ route('frontdesk.host.schedule') }}" class="btn-primary">Pre-register visitor</a>
</div>
@@ -47,8 +47,8 @@
<textarea name="notes" rows="3" class="mt-1 w-full rounded-lg border-slate-300 text-sm">{{ old('notes') }}</textarea>
</div>
<div class="flex gap-3">
<a href="{{ route('frontdesk.host.index') }}" class="flex-1 rounded-lg border border-slate-200 py-2 text-center text-sm font-medium">Cancel</a>
<button type="submit" class="btn-primary flex-1">Schedule visit</button>
<x-btn href="{{ route('frontdesk.host.index') }}" variant="secondary" class="flex-1 justify-center">Cancel</x-btn>
<x-btn type="submit" class="flex-1">Schedule visit</x-btn>
</div>
</form>
</div>
@@ -39,7 +39,7 @@
<td class="px-4 py-3 text-slate-600">{{ $host->office ?? '—' }}</td>
<td class="px-4 py-3 text-slate-600">{{ $host->email ?? $host->phone ?? '—' }}</td>
<td class="px-4 py-3 text-right">
<a href="{{ route('frontdesk.hosts.edit', $host) }}" class="text-sm text-indigo-600">Edit</a>
<x-btn href="{{ route('frontdesk.hosts.edit', $host) }}" variant="link" size="sm" plain>Edit</x-btn>
</td>
</tr>
@empty
@@ -12,7 +12,7 @@
<form method="GET" class="mt-4 flex flex-wrap gap-2">
<input type="date" name="from" value="{{ $from }}" class="rounded-lg border-slate-300 text-sm">
<input type="date" name="to" value="{{ $to }}" class="rounded-lg border-slate-300 text-sm">
<button type="submit" class="rounded-lg border border-slate-200 px-4 py-2 text-sm">Apply</button>
<x-btn type="submit" variant="secondary" size="sm">Apply</x-btn>
</form>
<div class="mt-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
@@ -76,7 +76,7 @@
<div class="flex flex-wrap items-center justify-between gap-3">
<h2 class="text-lg font-semibold text-slate-900">Staff attendance</h2>
@if ($canExport)
<a href="{{ route('frontdesk.employees.export.attendance', request()->query()) }}" class="text-sm font-medium text-indigo-600">Export HR CSV</a>
<x-btn href="{{ route('frontdesk.employees.export.attendance', request()->query()) }}" variant="link" size="sm" plain>Export HR CSV</x-btn>
@endif
</div>
<div class="mt-4 grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
@@ -5,12 +5,8 @@
<p class="text-sm text-slate-500">{{ $occupancy->count() }} visitors · {{ $staffOnSite->where('status', 'on_site')->count() }} staff on site · {{ $staffOnSite->where('status', 'stepped_out')->count() }} stepped out</p>
</div>
<div class="flex flex-wrap gap-2">
<a href="{{ route('frontdesk.security.evacuation') }}" class="rounded-lg border border-red-200 bg-red-50 px-4 py-2 text-sm font-medium text-red-700 hover:bg-red-100">
Evacuation report
</a>
<a href="{{ route('frontdesk.security.verify') }}" class="rounded-lg border border-slate-200 px-4 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50">
Verify badge
</a>
<x-btn href="{{ route('frontdesk.security.evacuation') }}" variant="danger">Evacuation report</x-btn>
<x-btn href="{{ route('frontdesk.security.verify') }}" variant="secondary">Verify badge</x-btn>
</div>
</div>
@@ -45,7 +41,7 @@
@if ($canCheckout)
<form method="POST" action="{{ route('frontdesk.security.checkout', $visit) }}">
@csrf
<button type="submit" class="text-sm text-indigo-600 hover:text-indigo-800">Check out</button>
<x-btn type="submit" variant="link" size="sm">Check out</x-btn>
</form>
@endif
</td>
@@ -36,7 +36,7 @@
<div class="flex justify-between"><dt class="text-slate-500">Watchlist</dt><dd class="capitalize">{{ str_replace('_', ' ', $visit->visitor->watchlist_status) }}</dd></div>
</dl>
<a href="{{ route('frontdesk.visits.show', $visit) }}" class="mt-4 inline-block text-sm font-medium text-indigo-600 hover:text-indigo-700">View full visit record</a>
<x-btn href="{{ route('frontdesk.visits.show', $visit) }}" variant="link" size="sm" plain class="mt-4">View full visit record</x-btn>
</div>
@else
<p class="mt-6 rounded-xl border border-red-200 bg-red-50 p-4 text-sm text-red-800">No matching visit found for {{ $lookup }}.</p>
@@ -9,7 +9,7 @@
<x-app-layout title="Console · {{ $counter['name'] ?? 'Counter' }}">
<div class="flex flex-wrap items-start justify-between gap-4">
<div>
<a href="{{ route('frontdesk.service-queues.index') }}" class="text-sm font-medium text-indigo-600"> Service queues</a>
<x-btn href="{{ route('frontdesk.service-queues.index') }}" variant="link" size="sm" plain> Service queues</x-btn>
<h1 class="mt-2 text-xl font-semibold text-slate-900">{{ $counter['name'] ?? 'Counter' }}</h1>
<p class="mt-1 text-sm text-slate-500">{{ $counter['branch'] ?? '' }} · Ladill Queue console</p>
</div>
@@ -5,11 +5,13 @@
<p class="text-sm text-slate-500">{{ $visitor->company }} · {{ $visitor->visit_count }} visits · {{ ucfirst(str_replace('_', ' ', $visitor->watchlist_status)) }}</p>
</div>
@if ($canManage)
<a href="{{ route('frontdesk.visitors.check-in', $visitor) }}" class="btn-primary">Quick check-in</a>
<form method="POST" action="{{ route('frontdesk.visitors.destroy', $visitor) }}" onsubmit="return confirm('Archive this visitor?')">
@csrf @method('DELETE')
<button type="submit" class="rounded-lg border border-red-200 px-4 py-2 text-sm text-red-700 hover:bg-red-50">Archive</button>
</form>
<div class="btn-group">
<x-btn href="{{ route('frontdesk.visitors.check-in', $visitor) }}">Quick check-in</x-btn>
<form method="POST" action="{{ route('frontdesk.visitors.destroy', $visitor) }}" onsubmit="return confirm('Archive this visitor?')">
@csrf @method('DELETE')
<x-btn type="submit" variant="danger">Archive</x-btn>
</form>
</div>
@endif
</div>
@@ -69,7 +71,7 @@
@endforeach
</select>
</div>
<button type="submit" class="rounded-lg border border-slate-200 px-3 py-1.5 text-sm text-slate-700">Update watchlist</button>
<x-btn type="submit" variant="secondary" size="sm">Update watchlist</x-btn>
</form>
@endif
@@ -20,7 +20,7 @@
<span class="rounded bg-indigo-50 px-2 py-0.5 text-xs text-indigo-700">Frequent</span>
@endif
</button>
<a href="{{ route('frontdesk.visitors.check-in', $visitor) }}" class="shrink-0 text-xs font-medium text-indigo-600 hover:text-indigo-700">Quick check-in</a>
<x-btn href="{{ route('frontdesk.visitors.check-in', $visitor) }}" variant="link" size="sm" plain class="shrink-0">Quick check-in</x-btn>
</div>
@endforeach
</div>
@@ -26,7 +26,7 @@
<option value="{{ $key }}" @selected(request('status') === $key)>{{ $label }}</option>
@endforeach
</select>
<button type="submit" class="rounded-lg border border-slate-200 px-4 py-2 text-sm">Filter</button>
<x-btn type="submit" variant="secondary" size="sm">Filter</x-btn>
</form>
<div class="overflow-hidden rounded-2xl border border-slate-200 bg-white">
+11 -11
View File
@@ -5,32 +5,32 @@
<h1 class="text-xl font-semibold text-slate-900">{{ $visit->visitor->full_name }}</h1>
<p class="text-sm text-slate-500">{{ ucfirst(str_replace('_', ' ', $visit->visitor_type)) }} · Badge {{ $visit->badge_code }}</p>
</div>
<div class="flex flex-wrap gap-2">
<div class="btn-group">
@if ($visit->isInside())
<a href="{{ route('frontdesk.visits.badge', $visit) }}" target="_blank" class="rounded-lg border border-slate-200 px-3 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50">Print badge</a>
<a href="{{ route('frontdesk.visits.badge.preview', $visit) }}" target="_blank" class="rounded-lg border border-slate-200 px-3 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50">Preview</a>
<x-btn href="{{ route('frontdesk.visits.badge', $visit) }}" target="_blank" variant="secondary" size="sm">Print badge</x-btn>
<x-btn href="{{ route('frontdesk.visits.badge.preview', $visit) }}" target="_blank" variant="secondary" size="sm">Preview</x-btn>
<form method="POST" action="{{ route('frontdesk.visits.checkout', $visit) }}">
@csrf
<button type="submit" class="rounded-lg bg-slate-900 px-3 py-2 text-sm font-medium text-white hover:bg-slate-800">Check out</button>
<x-btn type="submit" size="sm">Check out</x-btn>
</form>
@elseif ($canManage && $visit->awaitingApproval())
<form method="POST" action="{{ route('frontdesk.visits.approve', $visit) }}">
@csrf
<button type="submit" class="btn-primary">Approve & check in</button>
<x-btn type="submit">Approve & check in</x-btn>
</form>
@elseif ($canManage && $visit->canActivateCheckIn())
<form method="POST" action="{{ route('frontdesk.visits.activate', $visit) }}" class="flex items-center gap-2">
<form method="POST" action="{{ route('frontdesk.visits.activate', $visit) }}" class="flex flex-wrap items-center gap-2">
@csrf
<label class="flex items-center gap-1 text-xs text-slate-600">
<input type="checkbox" name="policies_accepted" value="1" required class="rounded border-slate-300 text-indigo-600">
Policies accepted
</label>
<button type="submit" class="btn-primary">Check in</button>
<x-btn type="submit">Check in</x-btn>
</form>
@elseif ($canManage && ! $visit->isInside())
<form method="POST" action="{{ route('frontdesk.visits.destroy', $visit) }}" onsubmit="return confirm('Archive this visit?')">
@csrf @method('DELETE')
<button type="submit" class="rounded-lg border border-red-200 px-3 py-2 text-sm text-red-700 hover:bg-red-50">Archive</button>
<x-btn type="submit" variant="danger" size="sm">Archive</x-btn>
</form>
@endif
</div>
@@ -41,17 +41,17 @@
@endif
@if ($canManage && $visit->isPending() && ! $visit->awaitingApproval())
<div class="mt-4 flex flex-wrap gap-2">
<div class="btn-group mt-4">
@if (in_array($visit->status, ['expected', 'scheduled', 'overdue'], true))
<form method="POST" action="{{ route('frontdesk.visits.waiting', $visit) }}">
@csrf
<button type="submit" class="rounded-lg border border-slate-200 px-3 py-2 text-sm text-slate-700 hover:bg-slate-50">Mark waiting</button>
<x-btn type="submit" variant="secondary" size="sm">Mark waiting</x-btn>
</form>
@endif
<form method="POST" action="{{ route('frontdesk.visits.cancel', $visit) }}" onsubmit="return confirm('Cancel this visit?')">
@csrf
<input type="hidden" name="reason" value="Cancelled by reception">
<button type="submit" class="rounded-lg border border-red-200 px-3 py-2 text-sm text-red-700 hover:bg-red-50">Cancel visit</button>
<x-btn type="submit" variant="danger" size="sm">Cancel visit</x-btn>
</form>
</div>
@endif
@@ -30,7 +30,7 @@
@endif
@endforeach
</select>
<button type="submit" class="rounded-lg border border-slate-200 px-4 py-2 text-sm">Filter</button>
<x-btn type="submit" variant="secondary" size="sm">Filter</x-btn>
</form>
<div class="overflow-hidden rounded-2xl border border-slate-200 bg-white">
@@ -52,7 +52,7 @@
<tr>
<td class="px-4 py-3 font-medium">
@if ($entry->visitor)
<a href="{{ route('frontdesk.visitors.show', $entry->visitor) }}" class="text-indigo-700">{{ $entry->full_name }}</a>
<a href="{{ route('frontdesk.visitors.show', $entry->visitor) }}" class="btn-link btn-link-plain font-medium text-slate-900 hover:text-indigo-700">{{ $entry->full_name }}</a>
@else
{{ $entry->full_name }}
@endif
@@ -64,7 +64,7 @@
@if ($canManage)
<form method="POST" action="{{ route('frontdesk.watchlist.destroy', $entry) }}" onsubmit="return confirm('Remove this watchlist entry?')">
@csrf @method('DELETE')
<button type="submit" class="text-sm text-red-600 hover:text-red-800">Remove</button>
<x-btn type="submit" variant="danger" size="sm">Remove</x-btn>
</form>
@endif
</td>